css第三节第十天

1、css盒模型

盒子：边框+内边距+内容区域+外边距组成。

IE6的盒模型的bug：背景色不能穿透 边框。而且如果不设置争取的doctype的话，ie6显示的盒子也不是标准的盒子。

2、边框

边框可以被背景色穿透，边框包括三部分可以进行设置：边框的宽度、边框的颜色、边框的样式。可以分别分开设置，也可以进行合写进行统一设置。

3.内边距

内边距是设置盒子与子盒子之间的距离。

如：

Pading: 10px;设置上下左右都是10px的内边距。

Padding：10px 12px;设置上下是10培训的宽度，左右是12像素的宽度。

Pading：10px 12px 13px 14px; //分别设置的是 上 右  下  左

如果设置三个值：上   左右  下

4、外边距

外边距设置兄弟元素之间的距离。

Margin的设置跟padding的一样。

Margin：0 auto;可以让 块级元素水平的居中。

原理：auto是设置外边距自动赋值。如果左右都是auto的时候，会把盒子所在行剩余的宽度除以2，然后分别赋值给左右的magin值，自然就会让盒子居中显示了。

行内元素的margin（padding）只能在水平方向起作用。垂直方向不起作用。