css外邊距合併是什麼意思？ css外邊距合併怎麼解決？

網頁佈局時，有時候需要使用css設定外邊距，但是在設定外邊距的時候，可能會遇到css外邊距合併也就是重疊的情況，那麼，我們該怎麼解決css外邊距合併的情況呢？以下這篇文章將為大家介紹一些解決css外邊距合併的方法。

我們先來css外邊距合併具體是什麼意思？

css外邊距合併（疊加）是指兩個垂直相鄰的塊級元素，當上下兩個邊距相遇時，起外邊距會產生重疊現象，且合併後的外邊距，等於其中較大者。如圖：

或是一個無內容的空元素，其本身上下邊距也會產生合併。如圖：

既然知道了css外邊距合併的具體情況後，我們就來看看怎麼解決css外邊距合併的情況。

防止css外邊距合併解決方法：

1、防止元素與子元素margin重疊：

用內層元素的margin透過外層元素的padding代替；

內層元素透明邊框border:20px solid transparent或父元素background-color；

外層元素 overflow:hidden;或overflow:auto;

2、防止元素與子元素、與父元素。與相鄰元素的重合：

設定元素絕對定位postion:absolute;或float:left;或display:inline-block；

關於上述的css外邊距合併解決方案可以根據實際的情況來採取，這裡也就不多說了，更多的精彩內容可以關注php中文網。

以上是css外邊距合併是什麼意思？ css外邊距合併怎麼解決？的詳細內容。更多資訊請關注PHP中文網其他相關文章！