本文详细介绍了CSS中的盒子模型，包括W3C标准盒子模型和IE标准（怪异）盒子模型的区别。在标准盒模型中，width和height仅包含内容区域，而怪异盒模型中它们包含了内容、边框和内边距。通过box-sizing属性可以设置解析模式，content-box对应标准模型，border-box对应怪异模型。理解这两种模型对于前端布局至关重要。
盒子模型可以用来对元素进行布局，包括内边距，边框，外边距，和实际内容这几个部分。
盒子模型分为:
- W3C 标准的盒子模型（标准盒模型）
- IE 标准的盒子模型（怪异盒模型）
区别：
- 标准盒模型中 width 和 height 指的是内容区域高度
- 标准盒模型下盒子的大小 = content + border + padding + margin
- 怪异盒模型中的 width 和height 指的是内容、边框、内边距总的宽度（content + border + padding）；计算整个盒子时候会存在偏差.
- 怪异盒模型下盒子的大小=width（content. + border + padding） + margin
可通过属性 来设置盒子模型的解析模式
- box-sizing ：content-box W3c 的标准模型(default)。
- box-sizing ：border-box IE 的怪异盒模型
2204
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
