使用margin定義塊元素的垂直外邊距時，可能會出現外邊距的合併。
當上下相鄰的兩個塊元素相遇時，如果上面的元素有下外邊距margin-bottom，下面的元素有上外邊距margin-top，則他們之間的垂直間距不是margin-bottom與margin-top之和，而是兩者中的較大者。這種現象被稱為相鄰塊元素垂直外邊距的合併（也稱外邊距塌陷）。
解決方案： 避免就好了。
對於兩個巢狀關係的塊元素，如果父元素沒有上內邊距及邊框，則父元素的上外邊距會與子元素的上外邊距發生合併，合併後的外邊距為兩者中的較大者，即使父元素的上外邊距為0，也會發生合併。
解決方案：
可以為父元素定義1畫素的上邊框或上內邊距。
可以為父元素新增overflow:hidden。
外邊距塌陷 外邊距合併
1.父子塊級 元素外邊距塌陷 子元素加margin top,父元素也加margin top,如果父元素沒有設定margin top,那預設0,取的是其中最大 的值,這個效果作用父元素身上啦 原因 他倆共用乙個外邊距 解決 方法一 給父元素加 border padding 方法二 給父元素加overf...
外邊距合併及塌陷
垂直外邊距合併指的是，當兩個不浮動的元素，它們的垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。給一邊外邊距設大至達到設計間距,一般設定margin top 在兩個不浮動的盒子巢狀時候，內部的盒子設定的margin top會加到外邊的盒子上，導致...
css的外邊距合併或者外邊距塌陷問題
已知兩個寬和高均為100px，margin均為20px的div垂直排列，現象如下圖所示 當設定css1的margin bottom 40px 或者css2的margin top 40px時，現象如下圖所示 結論 只有當兩個垂直排列的盒子的垂直外邊距挨在一起時會產生合併問題，此問題也不需要解決，記住誰...