CSS（深入研究合并外边距collapse）

本文主要是介绍CSS（深入研究合并外边距collapse），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

合并外边距

CSS中，两个或多个盒（可能但不一定是兄弟）的相邻的垂直方向的margin会被结合成一个margin。外边距按这种方式结合叫做合并（collapse）

1、相邻的垂直外边距会合并，除了

• html和body的外边距不合并
  

图一

• 元素如果带有clear属性（生成间隙clearance），上外边距与下外边距相邻（height为0），那么它的外边距会和兄弟的相邻外边距合并，但合并后的margin不会再和父级的下外边距合并。下面是例子：
  没有clear属性产生的clearance时：

<style>*{margin:0;}.container{margin: 50px;background: pink;}.container>div{width: 100px;height: 100px;text-align

这篇关于CSS（深入研究合并外边距collapse）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---