文档模式及盒子模型

css盒模型由两个盒子组成，外在的控制是否换行的盒子，以及内在的控制元素内容的盒子。比如：display: inline-block, 则它的外在的盒子就是inline也就是不占据一行，而block则表示内部的元素具有块状特性。所以，display: inline其实就是display: inline-inline的缩写，display: block就是display: block-block的缩写。

每一个内在的盒子有: width/height, padding, border, margin这几个控制盒子大小的属性。其中 width/height控制元素内容大小，padding则控制元素内容到border线内侧距离，border则是元素外围边框大小，而margin则是控制与其他元素的间距，它的背景透明。

对于早期，计算一个元素的占据大小，需要通过width +2* padding + 2*border来计算，css3中提出了box-sizing：border-box，通过这样设置，就可以使元素最终的宽高就是设定的width/height, 浏览器会根据width/height, padding, border的大小来自动调整内部元素的大小。

3.js如何设置获取盒子模型对应的宽和高

dom.style.width:

只能获取内联样式，因此是不准确的

dom.currentStyle.width :

与window.getComputedStyle方法功能相同，实现在旧版本的IE浏览器中

3）window.getComputedStyle(dom).width:

方法返回一个对象，该对象在应用活动样式表并解析这些值可能包含的任何基本计算后报告元素的所有CSS属性值。因此输出是准确的

4）dom.getBoundingClientRect().width

返回一个DOMRect对象，这个对象是由该元素的getClientRects()方法返回的一组矩形的集合。

DOMRect对象包含了一组用于描述边框的只读属性–left,top,right,bottom,单位为像素。除了width和height外的属性都是相对于视口的左上角位置而言的。

CSS 盒模型描述了以文档树中的元素而生成的矩形框，并根据排版模式进行布局。每个盒子都有一个内容区域（例如文本，图像等）以及周围可选的padding、border和margin区域。

CSS 盒模型负责计算：

块级元素占用多少空间。

边框是否重叠，边距是否合并。

盒子的尺寸。

盒模型有以下规则：

块级元素的大小由width、height、padding、border和margin决定。

如果没有指定height，则块级元素的高度等于其包含子元素的内容高度加上padding（除非有浮动元素，请参阅下文）。

如果没有指定width，则非浮动块级元素的宽度等于其父元素的宽度减去父元素的padding。

元素的height是由内容的height来计算的。

元素的width是由内容的width来计算的。

默认情况下，padding和border不是元素width和height的组成部分。

什么是DOCTYPE？

DOCTYPE是Docment Type的缩写，即文档模式。它用来指明文档（通常是指网页）所遵循的规范(如xhtml或html)及规范的版本（xhtml1.0或html4.0等）。

html文件中

<DOCTYPE>

标签位于文档最顶部，在

<html>

标签之前。

一个完整的DTD声明是由Public Identifier和System Identifier两部分组成的，其中system identifier就是指URI，例如：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Public Identifier：

-//W3C//DTD HTML 4.01 Transitional//EN

system identifier：

http://www.w3.org/TR/html4/loose.dtd

文档模式分类

文档模式及盒子模型

现代浏览器普遍有三种模式: 标准模式(standard mode)、近似标准模式(almost standard mode) 及怪异模式(quirks mode).

怪异模式是为了兼容老页面而设计的：早在浏览器大战时期，IE和Netscape各自遵循自己的一套规范，互不兼容，而后随着互联网的迅速发展，W3C制定了html和css规范，之后的浏览器的实现都遵循这套规范，但因为此时互联网上已经存在很多针对旧版IE和Netscape设计的网页，如果依照W3C标准来解析，将会使这些页面错乱，因此浏览器开发商推出了两种模式：quirks mode 和 stardard mode. 其中quirks mode按照Netspace4和IE5的实现解析页面，stardard mode按照W3C标准解析页面。

在Internet Explorer 6、7、8和9中，Quirks模式实际上是冻结的IE 5.5，IE10和IE11的主要Quirks模式（类似于其他浏览器的Quirks模式）不再是IE 5.5的模仿，而是寻求与其他浏览器的Quirks模式互操作，有时也称为“互操作的Quirks模式”。

近似标准模式是为了解决table中内联图片而设计的：早期的网页多是以table布局，单元格的高度会根据内容自动伸缩，所以当一个单元格中只有图片时，即使这个图片的高度是1px，浏览器都可以很好地呈现。但遵循了w3c标准的现代浏览器并不会这么去解析，w3c标准将img定义为内联元素，而内联元素在盒模型中是以基线对齐的。

为了解决这个问题，浏览器开发商提供了“近似标准模式”，这种模式与标准模式一致，除了在处理下面这种情况时：

如果一个块级元素除了空白文本（空格，tab等字符）外再无其它内容，则它的高度按0处理；如果有子元素，则它的高度不能比子元素大，无论它的font-size多大。

标准模式：遵循标准。

如何触发各种模式

文档模式及盒子模型

近似标准模式

HTML 4.01 Transitional or Frameset DOCTYPE(带URL)

或

XHTML 1.0 Transitional or Frameset DOCTYPE(带或不带URL)

都会触发近似标准模式。

The public identifier "-//W3C//DTD XHTML 1.0 Transitional//EN"
The public identifier "-//W3C//DTD XHTML 1.0 Frameset//EN"
The public identifier "-//W3C//DTD HTML 4.01 Transitional//EN", with a system identifier
The public identifier "-//W3C//DTD HTML 4.01 Frameset//EN", with a system identifier
The IBM system DOCTYPE "http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"

标准模式

//包括IE6在内的所有浏览器都会以标准模式去呈现。这也是mozilla推荐的做法
<!DOCTYPE html>
//完整的HTML4.01 Strict 和 XHTML1.0 Strict(带或不带URI) 也会触发标准模式
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

如果你的XHTML文档以application/xhtml+xml 作为MIME类型，则你无需再声明DOCTYPE，浏览器始终会以标准模式去解析这类文档。不过一个例外就是IE8及以下版本的IE会将此类文档当成一个下载链接，并弹出文件下载弹窗。IE9开始支持这种类型的文档。但如果你的XHTML文档以text/html 作为MIME类型，则你需要声明DOCTYPE以触发标准模式

怪异模式

不写Doctype或错误的Doctype
Doctype之前有注释或xml声明（在IE9-会触发）
HTML 4.01 Transitional or Frameset DOCTYPE(不带URL)

标准模式和怪异模式下页面渲染的区别

盒模型

怪异模式采用IE盒子模型，标准模式使用W3C标准盒子模型。

文档模式及盒子模型

图片元素的垂直对齐方式

对于inline元素和table-cell元素，标准模式下vertical-align属性默认取值为baseline，在怪异模式下，table单元格中的图片的vertical-align属性默认取值为bottom，因此在图片底部会有及像素的空间。

在标准模式下,inline元素和tablecell元素的verticle-aligh属性默认取值是baseline,这也是我们有时会看到图片底部会有几像素留白的原因.

但是当inline元素内只有图,并且处于怪异模式的时候,inline元素里的元素的vertical-aligh属性默认值是bottom,此时就不会有白条的效果.

table元素中的字体

标准模式：对于font的属性都是可以继承的

怪异模式：对于table元素，字体的某些属性将不会从body等其他封装元素中继承得到，特别是font-size属性。

内联元素的尺寸

行内元素分为replaced和non-replaced两类,而像input,textarea,img等可以设置宽高的行内元素,成为replaced元素,而那些不能设置宽高的元素被称为non-replaced元素,例如span。

标准模式：non-replaced inline元素无法自定义大小

怪异模式：定义这些元素的width，height属性可以影响这些元素显示的尺寸。

元素的百分比高度

CSS中对于元素的百分比高度规定如下：百分比为元素包含块的高度，不可为负值，如果包含块的高度没有显示给出，该值等同于auto，所以百分比的高度必须在父元素有高度声明的情况下使用。

当一个元素使用百分比高度时，

标准模式：高度取决于内容变化，

怪异模式：百分比高度被正确应用。

元素溢出的处理

如果一个元素内部的内容出现了溢出,并且我们没有设置overflow属性,即默认vislble时:

标准模式：溢出的部分会超出盒子本身,在盒子外部继续显示.

怪异模式：溢出的部分会扩展盒子本身,即外部盒子的大小不一定由css样式决定,会根据内部内容的大小自动调整.

呈现方面的其他差异比较小，而且是与特定浏览器相关的，包括对于十六进制颜色值不需要#号、假设CSS中没有指定单位的长度的单位是像素，以及在使用关键字时将字号增加一级。

怎么知道浏览器用的是哪种模式

在FF，右键–>查看页面信息—>呈现模式（Render Mode）

在IE，F12—>文档模式

参考链接

浏览器标准模式和怪异模式之间的区别是什么
深入理解DOCTYPE之 DOCTYPE的标准模式、近似标准模式及怪异模式

一、前言

从 IE8 开始引入了文档兼容模式的概念，作为开发人员的我们可以在开发人员工具中通过“浏览器模式”和“文档模式”（IE11 开始改为“浏览器模式”改成更贴切的“用户代理字符串”）品味一番，它的出现极大地方便了苦逼的前端攻城狮们适配各版本的 IE，但 jser 们也不能完全信任它，因为它只是提供尽可能的文档模式模拟而已。

注意：本文内容仅针对 HTTP 头 Content-Type 字段为 text/html 的 html 文档作说明，而 XML 文档不在本文的讨论范围之内。

二、什么是浏览器模式？

“浏览器模式（IE11 索性就改名为“用户代理字符串”）用来设置 navigator.userAgent 和 navigator.appVersion 的值。

它唯一需要注意的是，在不同的 IE 版本中，它与文档模式的关系可不相同。

IE89 中，倘若浏览器模式被设置为 Internet Explorer7，那么文档模式的只能设置为 7,6,5；

IE11 中，用户代理字符串设置和文档模式可谓是没有半毛钱关系。

三、什么是文档模式？

对于以 Webkit、Molliza 等作为内核的浏览器来说，DOM 树的解析、渲染，JS 的 API 等主要与内核版本挂钩；而对于 IE 浏览器而言，这些从 IE6 开始就跟文档模式挂钩了。

3.1. 从“久远”的 IE5.5 说起

现在虽然没什么用使用 IE5.5 了，但它却从未离开过我们，因为 IE5.5 一直以怪异模式（Quirks，IE5 的文档模式）的形式存活在我们的身边。不过在那个只有 IE5.5 的年代，并没有 Quirks 这一说法，只是后来 IE6 面世后逐渐向 W3C 标准靠拢，而 IE5.5 下 DOM 树的解析、渲染等都与 W3C 标准有很大差别，于是命其名为 Quirks。

3.2. 兼容模式——IE6 的新发明

由于 IE6 和 IE5.5 下 DOM 树的解析等都有很大差异，导致那些适配 IE5.5 的老网站无法在 IE6 上正常显示，于是出现了一个新功能——“兼容模式”，用于解决老网站的显示问题。IE6 的兼容模式就两种，怪异模式（Quirks）和 IE6 标准模式。（IE7 也只有怪异模式和 IE7 标准模式）

IE6 默认使用怪异模式（Quirks），仅当以<!DOCTYPE>作为文档第一行声明文档类型时，才采用 IE6 的标准模式，即使 IE 无法识别所声明的文档类型。（IE7 也是这样）

注意：这时的兼容模式主要是解决显示问题，要知道那时的 JS 只是小配角而已。

3.3. 文档兼容性模式——IE8 的新宠

“文档兼容性模式”是对“兼容模式”的扩展，就 IE8 而言，除了提供怪异模式（Quirks）和 IE8 标准模式外，还提供了 IE7 标准模式、模拟 IE7 模式，而且设置的方式也丰富得多。

四、文档模式的种类

1. 怪异模式

IE6789 的是 IE5.5 的文档模式，IE10+和 Chrome 等浏览器是 W3C 规范的怪异模式。

2. 标准模式（非怪异模式）

W3C 标准的文档模式，但各浏览器的实现阶段不尽相同。

3. 准标准模式（有限怪异模式）

由于该模式离 W3C 标准仍然有一段距离，因此被称作准标准模式（或有限怪异模式）。IE6、7 的标准模式实际上就是准标准模式，而 IE8+才有实质上的标准模式。

五、IE8+设置文档模式的方式

开发者常用的方式：

1. 开发者工具中的“文档模式”；

2. 通过在 head 标签内加入如的元数据标签（该例子将文档模式设置为 IE7 标准模式）；

3. 通过<!DOCTYPE>的增删，在标准模式和怪异模式（Quirks）间切换；

4. 通过 Web 服务器配置(让 http response header 带上 X-UA-Compatible: IE=edge)

IIS 的 web.config 配置信息：

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <clear />
        <add name="X-UA-Compatible" value="IE=EmulateIE7" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>
</configuration>

用户常用的方式：

1. 点击地址栏的兼容性视图切换按钮（仅当 HTTP、HTTPS 协议时才出现该按钮）；

2. 若网页是在 Intranet 区域中加载，配置使用兼容性视图显示 Intranet 区域中的网页；

3. 配置浏览器使用兼容视图浏览所有网页；

4. 将网站加入到兼容性视图名单中；

5. 内网管理员将该网站加入到兼容性视图浏览名单中；

微软的方式：

1. IE 会定期向微软官网拉数据，假如某网站被列入微软的兼容性视图浏览名单中，那么就会 IE 就会以兼容性视图模式来处理该网站。

由于

<meta http-equiv="X-UA-Compatible" content="IE=edge">

不一定很生效，因为当端口不是 80 时，IE 默认设置是将其视为内网应用(intranet site)，并采用兼容模式来显示(display intranet site in compatibility view)。因此最好采用 HTTP Response Header 的方式。

六、文档模式的决定方式

所有 IE 浏览器在默认情况下（

<meta http-equiv="X-UA-Compatible">

与

<!DOCTYPE>

均没有），是采用怪异模式（Quirks）；当有<!DOCTYPE>时，均采用浏览器版本对应的标准模式（如 IE8 就采用 IE8 标准模式，IE11 就采用 IE11 标准模式）。

现在要注意的是，当出现

<meta http-equiv="X-UA-Compatible">

时，文档模式将会如何呢？我们首先了解一下 IE11 下它的 content 属性值范围吧，具体范围如下：

IE=5、IE=7、IE=EmulateIE7、IE=8、IE=EmulateIE8、IE=9、IE=10、 IE=11、 IE=Edge

1. IE=5：表示采用怪异模式；

2. IE=7 等纯数字的值：表示采用对应 IE 版本的标准模式，即使不是以<!DOCTYPE>作为文档第一行，文档模式依旧使用标准模式；

3. IE=EmulateIE7 等含 EmulateIE 字符串的值：表示采用模拟对应 IE 版本的模式，就是以<!DOCTYPE>作为文档第一行则采用标准模式，否则采用怪异模式。

4. IE=Edge：表示采用浏览器自身版本的文档模式，如 IE11，以

<!DOCTYPE html>

作为文档第一行则采用 IE11 标准模式，否则采用怪异模式。

注意：

由于 document compatibility mode 仅在 IE8/9/10 生效，因此在 IE11 时设置

<meta http-equiv="X-UA-Compatible">

是无效的，只有在开发工具中设置才有效果。

若要在 IE11 下采用旧版本的文档模式，则要采用 Enterprise Mode(https://blogs.msdn.microsoft.com/ie/2014/04/02/stay-up-to-date-with-enterprise-mode-for-internet-explorer-11/)

10 及以上的文档模式，若文档第一行不是有效的<!DOCTYPE>，则 document.compatMode 返回 BackCompat，但 document.documentMode 却返回正确的文档模式；
9 及以下的文档模式，只要文档第一行出现<!DOCTYPE>，不管是否有效，document.compatMode 均返回 CSS1Compat。当文档第一行没有<!DOCTYPE>且没有指定标准模式时，document.compatMode 才返回 BackCompat，且 document.documentMode 必定返回 5。

七、注意

6.1. 多个标签时只认第一个

<html>
    <head>
      <meta http-equiv="X-UA-Compatible" content="IE=7">
      <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
    </head>
    <body></body>
    <script type="text/javascript"> console.log(document.documentMode); // 输出 7
    </script>
</html>

6.2. 无效 content 值，就设置为最接近的文档模式

IE=a：文档模式为 5

IE=7.5：文档模式 7

6.4. 一个标签设置多个文档模式，浏览器会自动选择可用的最高的文档模式

<html>
    <head>
      <meta http-equiv="X-UA-Compatible" content="IE=7;IE=9;IE=8">
    </head>
    <body></body>
    <script type="text/javascript"> console.log(document.documentMode); // IE11中，输出 9
    </script>
</html>

八、不一样的标准模式

虽然说 IE6、7、8、9、10、11 均有标准模式，但由于 W3C 标准规范内容随时间的增改，而且浏览器对标准的实现是阶段性的，因此个版本的标准模式不尽相同。

九、不一样的怪异模式

IE6789 的怪异模式其实就是 IE5.5 的文档模式，但从 IE10 开始它的遵守了 W3C 规范的怪异模式。所以大家不要被名字而蒙骗咯！

举个栗子：

<html>
  <head>
     <style type="text/css"> #target{
           width: 100px;
           height: 20px;
           border: solid 1px red;
           margin: 0 auto;
       }
     </style>
  </head>
  <body>
       <div id="target"><div>
  </body>
</html>

上面的代码在是运行在怪异模式下，在 IE6789 下若要 div#target 自动水平居中，必须加上转成用标准模式渲染才行。但在 IE10+、Webkit 和 Molliza 中即使在怪异模式下 div#target 也会自动水平居中。

十、文档模式影响到哪些方面

布局

　　表格、单元格的样式等都受到文档模式的影响，尤其是盒子模型。
解析

　　 css 和 html 的解析也会受到文档模式的影响，就像在 IE678 标准模式时，HTML 解析时会将嵌套 form 下的子节点挪到上一节；而 IE9 标准模式时不会。
脚本

　　这个我想不用多说大家也深有体验了。

十一、Jser 别太开心

兼容性模式仅仅是方便我们开发调试而已，并不能完全替代 IETester，更不能替代在真实的 IE67 上测试。因为除了浏览器版本对应的文档模式外，其他文档模式均是跑在浏览器内核虚拟机上，而这些虚拟机仅仅能模拟真实浏览器内核的大部分 DOM 树解析、渲染和 JS API 而已。例如在 IE8 上设定文档模式为怪异模式，但 XMLHttpRequest 依旧可用（XMLHttpRequest 是从 IE7 开始才有的），因此在检测浏览器特性的时候，特征嗅探比判断浏览器的文档模式更为准确、好用。

十二、总结

从“浏览器模式”与“文档模式”关联，“文档模式”与“盒子模型的渲染模式”挂钩，到 IE10+一下子将三者关联切断，转向 W3C 标准。一直觉得 IE9 是 IE 非标准与标准间的过渡带，现在就更加认定是这样了。

也许大家看到这里会更加疑惑，似乎了解上述内容会加重开发的负担（考虑的点更多了）。

其实我们只要再次明确一下“文档兼容性模式”的目的就好了，对终端用户来讲它是为了在新版 IE 中尽量正确地显示老网站；对开发者来讲它是为了方便调试新网站在旧版 IE 上的显示效果和 JS 的有效性，极端情况下会通过锁定文档模式来启用旧技术（如 ie67 下的 vml）。

所以作为普通开发者的我们只需做三件事：

1. 以有效的 doctype 作为文档的第一行，保证渲染模式为标准模式；

2. 开发前设定网站的最佳运行环境范围，就是需适配的 IE 版本号，是否适配 Webkit 等；

3. 开发并使用各种 hacks 为兼容性付出不懈的努力。

另外我曾参与一个项目需要运用 VML 来画图，客户大部分使用 IE678，少部分使用 IE910，其他浏览器的可忽略不计，于是就可以通过锁定文档模式为模拟 IE7 标准模式来启用 VML 支持了。（官方声 IE9+不支持 VML，但实际上 IE8 已经不支持了。）

若作为库或框架开发者，由于文档模式影响大部分 JS API，而渲染模式影响各项样式值和获取方式等等，情况会复杂得多。因此综合文档模式判断、特征嗅探、渲染模式判断是必须的，上述内容只是挖坑而已。

首先，浏览器并没有所谓的“HTML 5 模式"，而是只有三种：怪异模式（Quirks)，几乎标准的模式（Limited Quirks）和标准模式（Standards），其中几乎标准的模式和标准模式之间的唯一差异在于是否对元素给定行高（line-height）和基线（baseline）

几乎标准模式中，如果标签所在行没有其他的行内元素，将不指定基线（baseline），标签因此会紧贴着父元素底部在标准模式中，行框总是会包含类似字母 g，f 尾巴下伸出来的那一部分空间（针对下行字母），即使行框内并没有任何内容。因此这种情况下你看到的跟父元素底部几个像素的间隙实际上就是为”字母尾巴“预留的

使用 XHTML Transitional Doctype 会是浏览器运行在”几乎标准模式（Limited Quirks）”。如果你使用XHTML Strict 或者HTML 4 Strict模式，你将看到和使用HTML 5 模式同样的间隙，因为这是标准模式（Standards mode）

文档模式

文档模式主要分为混杂模式和标准模式两种，而标准模式又可划分为标准模式，准标准模式，超级标准模式三种（其中标准模式和准标准模式非常接近，他们的差异几乎可以忽略不计）。具体区分如下图：

文档模式及盒子模型

标准模式

可通过以下任何一种类型来开启：

HTML 4.01 严格型

<!-- HTML 4.01 严格型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD HTML 4.01//EN"
"http://www.3c.org/TR/html4/strict.dtd">

XHTML 1.0 严格型

<!-- XHTML 1.0 严格型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

HTML 5

<!-- HTML 5 -->

<!DOCTYPE HTML>

准标准模式

可通过使用过渡型（transitional）或框架集型（frameset）来触发，如下：

HTML 4.01 过渡型

<!-- HTML 4.01 过渡型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.3c.org/TR/html4/DTD/loose.dtd">

HTML 4.01 框架集型

<!-- HTML 4.01 框架集型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.3c.org/TR/html4/frameset.dtd">

XHTML 1.0 过渡型

<!-- XHTML 1.0 过渡型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.3c.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

XHTML 1.0 框架集型

<!-- XHTML 1.0 框架集型 -->

<!DOCTYPE HTML PUBLIC 
"-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.3c.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

文档模式及盒子模型

什么是DOCTYPE？

文档模式分类

如何触发各种模式

标准模式和怪异模式下页面渲染的区别

怎么知道浏览器用的是哪种模式

参考链接

一、前言

二、什么是浏览器模式？

三、什么是文档模式？

四、文档模式的种类

五、IE8+设置文档模式的方式

六、文档模式的决定方式

七、注意

八、不一样的标准模式

九、不一样的怪异模式

十、文档模式影响到哪些方面

十一、Jser 别太开心

十二、总结

继续阅读

为什么把CSS放头部，script放下面

jQuery练习一. 选择器练习二. DOM操作练习三. 事件练习

underscore模板功能的使用和学习

vue3 transitionvue3 transition组件和vue2 transition组件

CSS之折叠菜单

web开发之前后端渲染

DOM下元素 offset client scroll 相关属性简介

IE8 CSS设置DIV居中，添加“margin:0 auto”

403 Forbidden，You don't have permission to access / on this server.Forbidden

JavaScript的那些坑之事件代理事件代理事件阶段

ACS基本配置-权限等级管理

vue （vue2.0）使用总结(从大体结构总结)

父子组件间传值的实现父子组件间传值的实现

vue搭建过程及出现问题

layui多任务上传添加进度条