盒模型

本教程版权归小圆和饥人谷所有，转载须说明来源

问答

1. 盒模型包括哪些属性

包括内容(content)、内边距(padding)、边框(border)、外边距(margin)。

2. text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中

文字居中或者让inline-block居中，一般作用在块级元素上或者inline-block上，能让块级元素里的文字和inline-block元素居中，能让inline-block里的文字居中。

3. 如果遇到一个属性想知道兼容性，在哪查看?

在网站Can I Use查看。

4. IE盒模型和W3C盒模型有什么区别?

W3C盒模型

IE盒模型

在不加 doctype 的情况下，IE 浏览器中会显示为IE 盒模型（也叫怪异盒模型），它的contentd的宽和高包含了border和 padding。

5. 以下代码的作用？兼容性？

*{
  box-sizing: border-box;
}

作用：为元素设定的宽度和高度决定了元素的边框盒。就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。
兼容性：

Box-sizing