CSS外邊距摺疊引發的問題

第一種：兩個塊級元素的上下邊距摺疊

第二種：父元素和子元素（或者最後乙個元素）的外邊距

第三種：空的塊級元素的上下外邊距

摺疊的根本原因：

margin之間直接接觸，沒有阻隔

摺疊後外邊距的計算：

1.如果兩個外邊距都是正值，摺疊後的外邊距取較大的乙個

2.如果兩個外邊距一正一負，摺疊後的邊距為邊距之和

3.如果兩個外邊距都為負數，摺疊後邊距為較小的邊距

解決方案：解決方法實際上也就是阻止外邊距直接接觸

第一種、第三種：只有靜態流的元素才會發生外邊距合併故設定float position inline-block都可以

CSS外邊距摺疊引發的問題

第一種 兩個塊級元素的上下邊距摺疊 第二種 父元素和子元素 或者最後乙個元素 的外邊距 第三種 空的塊級元素的上下外邊距 摺疊的根本原因 margin之間直接接觸，沒有阻隔 摺疊後外邊距的計算 1.如果兩個外邊距都是正值，摺疊後的外邊距取較大的乙個 2.如果兩個外邊距一正一負，摺疊後的邊距為邊距之和...

CSS外邊距摺疊引發的問題

第一種 兩個塊級元素的上下邊距摺疊 第二種 父元素和子元素 或者最後乙個元素 的外邊距 第三種 空的塊級元素的上下外邊距 摺疊的根本原因 margin之間直接接觸，沒有阻隔 摺疊後外邊距的計算 1.如果兩個外邊距都是正值，摺疊後的外邊距取較大的乙個 2.如果兩個外邊距一正一負，摺疊後的邊距為邊距之和...

CSS外邊距摺疊問題

毗鄰的兩個或多個margin會合併成乙個margin，叫做外邊距摺疊，也叫外邊距合併。如果你還是不懂請參照 css 外邊距合併 兩點 1 摺疊只會發生在垂直方向 2 合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。摺疊規則 避免外邊距摺疊 type text css body div1...