前端基础（问答6-1）

---

keywords：盒模型

---

• 盒模型包括哪些属性

border
padding
width
height```

- ###text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
text-align:center可以使行内元素水平居中，这里的元素不局限于文本，还可以是图像。text-align具有继承性，需要写在块级元素的样式中。

- ###IE 盒模型和W3C盒模型有什么区别?
W3C标准中padding、border所占的空间不在width、height范围内，而IE的盒模型width包括content尺寸＋padding＋border。


![W3C盒模型.png](http://upload-images.jianshu.io/upload_images/2215361-6eed19a7e4b97d50.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

![IE盒模型.png](http://upload-images.jianshu.io/upload_images/2215361-55668f3054b3b05d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

- ###以下代码的作用？兼容性？
```* {
 box-sizing: border-box;
}```
对页面的所有元素应用样式：width和height计算需加上padding和border。
box-sizing有三种值：content-box、padding-box、border-box。
![box-sizing](https://www.abeautifulsite.net/content/uploads/2014/08/box-sizing-comparison.png)