外边距合并现象在网页布局中非常的常见，必须对此有明确的把我，以此做到未雨绸缪，否则可能影响工作效率，甚至严重阻碍项目的进度。在网络上已经有大量的相关文章，下面再通过实例结合对网络教材的总结，再来介绍一下外边距合并现象。
概念:
相邻的两个或者多个外边距在垂直方向上合并成一个外边距，这就是所谓的外边距合并。
水平方向不存在此现象。
外边距合并产生条件:
1.相邻的外边距之间没有非空内容、padding和border和clear分隔。
2.对象都处于文档流中，即非浮动和position属性值不为absolute和fixed的元素。
合并可以存在于兄弟对象之间，也可以存在于父子对象之间，下面就分开介绍一下:
一.兄弟对象之间的外边距合并:
实例如下:
蚂蚁部落 div{ width:100px; height:100px; } .top{ background-color:green; margin-bottom:20px; } .bottom{ background-color:red; margin-top:10px; }
查看更多关于margin外边距合并详解_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://www.haodehen.cn/did108593