針對css外邊距合併的問題，我針對網上一些解決措施，做了一些總結和驗證，總結如下：（水平margin不會被合併，垂直margin會被合併）
1.設定了的overflow屬性的盒模型，則其與子元素之間的垂直margin不會合併，但其與父元素之間、與相鄰元素之間的margin會合併。（overflow取值為visible除外）
2.設定了float屬性的盒模型，則其與相鄰元素之間、其與父元素之間、其與子元素之間的垂直margin都不會被合併。
3.設定了絕對定位position:absolute的盒模型，則其與相鄰元素之間、其與父元素之間、其與子元素之間的垂直margin都不會被合併。（但應注意position:absolute對其後元素的position的影響）
4、設定了display:inline-block的盒模型，則其與相鄰元素之間、其與父元素之間、其與子元素之間的垂直margin都不會被合併。
相鄰元素的margin是否被摺疊會影響元素的位置
防止外邊距合併解決方案：
1.防止元素與子元素margin重疊：
用內層元素的margin通過外層元素的padding代替；
內層元素透明邊框 border:20px solid transparent/父元素background-color;
外層元素 overflow:hidden;/overflow:auto;
2.防止元素與子元素、與父元素。與相鄰元素的重合：
設定元素絕對定位 postion:absolute;或float:left;或display:inline-block;
CSS外邊距合併的問題
外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。外邊距合併 疊加 是乙個相當簡單的概念。但是，在實踐中對網頁進行布局時，它會造成許多混淆。簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外...
CSS外邊距合併的問題
外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。外邊距合併 疊加 是乙個相當簡單的概念。但是，在實踐中對網頁進行布局時，它會造成許多混淆。簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外...
css的外邊距合併或者外邊距塌陷問題
已知兩個寬和高均為100px，margin均為20px的div垂直排列，現象如下圖所示 當設定css1的margin bottom 40px 或者css2的margin top 40px時，現象如下圖所示 結論 只有當兩個垂直排列的盒子的垂直外邊距挨在一起時會產生合併問題，此問題也不需要解決，記住誰...