外邊距的疊加有3種情況：
在討論外邊距的疊加之前需要先宣告：只有普通文件流中塊元素的垂直外邊距才會發生外邊距疊加，涉及行內框，浮動框，絕對定位框的情況下外邊距不會疊加。
1.當兩個以及兩個以上元素處於相對上下位置（且）時，上面元素的下外邊距和下面元素的上外邊距會發生疊加，最終的顯示結果為兩個外邊距中較大的乙個，如果相等則合為乙個顯示。（即使加了內邊距和邊框也不能阻止疊加）。
測試**
the top
the bottom
2.乙個包含在另乙個元素內的元素，如果外部元素沒有內邊距或有邊框將內容區與外邊距分隔開， 那麼內部元素的外邊距和外部元素的外邊距發生疊加，最終表現為兩者中較大的乙個做為實際外邊距（例如只設定了上外邊距的內部元素的頂部只能和外部元素的上邊緣緊鄰著，內部元素的外邊距體現在外部元素與他們整體之外的元素的上外邊距）， 這是一種很奇怪的乙個效果，但是如果給外部元素加上邊框或者內邊距（注意是外部元素），就不會有疊加情況了。
測試**：
3.空元素的疊加：對於乙個空元素如果設定了上外邊距和下外邊距那麼他們就會發生疊加，結果為兩者中值較大的乙個外邊距，若相等則合併為乙個，如果再遇到其他外邊距會繼續疊加。
測試**：結果在瀏覽器的開發者檢視器裡找到該空元素檢視其實際外邊距大小。
來自初學者的總結/記錄，若有不對，還望指教
外邊距疊加
外邊距疊加其實是乙個非常簡單的概念，不過，一開始我還是被其高大上的名字 margin collapsing 唬得不輕 什麼是外邊距疊加呢？在normal流中，同一bfc下，相鄰垂直外邊距會重疊形成乙個外邊距，外邊距高度為疊加的外邊距較大者。我是這樣記住的 盡量在滿足雙方的margin下，使得marg...
CSS外邊距疊加問題
css外邊距疊加就是margin collapse，邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距,水平邊 距永遠不會重合。重疊結果計算規則 兩個相鄰的外邊距都是正數時，摺疊結果是它們兩個之間較大的值.兩個相鄰的外邊距都是負數時，摺疊結果是兩者絕對值的較大值.兩個邊距一正一負時，摺疊結...
CSS外邊距疊加的問題
今天同事遇到了乙個很奇怪的問題。簡化來看，最初的原因是這樣的 上 style background black width 300px height 300px style background blue width 200px height 200px style background pink ...