盒模型

怪异盒模型（box-sizing：border-box）                                标准盒模型（box-sizing：content-box）

                                                  

• 在标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右) 

• 在怪异模式下，一个块的总宽度= width + margin(左右)（即width已经包含了padding和border值）

外边距合并：

      ①两个兄弟元素同时设置外边距，会选择大的边距合并

      ②两个元素是父子元素，给子元素加margin-top，两个元素都会有margin-top

解决：

      ①给父元素加overflow-hidden

      ②父元素和子元素都浮动

      ③定位

      ④给父元素加边框