盒模型

  盒模型指在css布局中，html中的每一个元素在浏览器中的解析均可以被看做一个盒子，拥有盒子同样的外形和平面空间。

  盒模型由 margin , border , padding , content 四部分组成。

  margin的几种不一样的写法：

　　①main{margin:10px 20px 10px 20px;}这四个值分别设置类名为main的模块上、右、下、左四个方位外边距的值。

　　②main{margin:10px 20px;}这两个值分别设定类名为main的模块的上下、左右的外边距。

　　③main{margin:10px 20px 10px;}第一个值设定上外边距，第二个值设定左右外边距，第三个值设定下外边距。

　　④main{margin:10px;}若是就一个值的话，就设定了四个方向的外边距都10px。

　　⑤main{ margin:20px auto;}这样设值的意思是上下两个方位的外边距为20px，左右两个方位的外边距自动适应居中。

  margin里面的bug：

　　①margin横向上是加法，可是竖向上倒是叠加的，那个值大就按那个值进行排列。

　　②在行标签里面设置margin时，横向是能够实现的，可是在竖向上就没有

　　③IE6下的横向双倍bug，解决的办法是：display：inline；

  盒标签的标准模式是：内容的宽度+左右边距的宽度+左右边框的宽度+左右外边距的宽度

             怪异模式是：内容+外边距