1.什么是外边距重叠
外边距重叠是指两个或多个盒子(可能相邻也可能嵌套)的相邻边界重合在一起而形成一个单一边界,外边距的重叠只产生在普通流的垂直相邻边界间。
如果都是正边界，边界宽度是相邻边界宽度中最大的值。如果出现负边界，则在最大的正边界中减去绝对值最大的负边界。如果没有正边界，则从零中减去绝对值最大的负边界。
2.外边距重叠的图示
当一个元素出现在另一个元素上面时，第一个元素的底边界与第二个元素的顶边界发生叠加
当一个元素包含在另一个元素中时，它们的顶和底边界也发生叠加
假设有一个空元素，它有边界，但是没有边框或填充。在这种情况下，顶边界与底边界就碰到了一起，它们会发生叠加
3.外边距重叠的意义
当我们上下排列一系列规则的块级元素时，那么块元素之间因为外边距重叠的存在，段落之间就不会产生双倍的距离，这样各处距离就一致了
4.外边距不重叠的情况
水平margin永远不会重合
设置了overflow属性(visible除外)的元素和它的子元素之间的margin不会重叠
设置了绝对定位（position:absolute）的盒模型，垂直margin不会被重叠，和子元素之间也不重叠
设置了display:inline-block的元素，垂直margin不会重叠，和子元素之间也不重叠
根元素(如html)与body的margin不会重叠
5.防止外边距重叠的方法
元素绝对定位postion:absolute;一般用在内层元素
内层元素加float:left;或display:inline-block;
外层元素用padding增加边距
外层元素设置overflow:hidden;
内层元素透明边框border:1px solid transparent;
6.参考文献
www.hujuntao.com/web/css/css-margin-overlap.html" CSS外边距(margin)重叠及防止方法
http://developer.51cto.com/art/201008/221940CSS中margin边界叠加问题及解决方案
//www.greatytc.com/p/265fb9f0de97" CSS2速查表- BFC与边距重叠详解
