概念：外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距，合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者
注意：只有普通文件流中塊級元素
的垂直外邊距才會發生外邊距合併。行內框、浮動框或絕對定位之間的外邊距不會合併。
當乙個元素包含在另乙個元素中時（假設沒有內邊距或邊框把外邊距分隔開），它們的上和/或下外邊距會發生合併。（.父元素與第乙個/最後乙個子元素之間的垂直外邊距）
除了上垂直外邊距會發生合併，下外邊距也會發生合併。
當乙個元素出現在另乙個元素上面時，第乙個元素的下外邊距與第二個元素的上外邊距會發生合併。
給父元素新增overflow:hidden，會觸發bfc。
給父元素新增邊框(border-top/border-bottom)。（阻隔margin直接接觸）
給父元素新增內邊距（padding-top/padding-bottom）。（阻隔margin直接接觸）
給父元素或者子元素新增浮動float或者定位absolute。
父元素或者子元素設定display:inline-block
首先，垂直外邊距的發生依賴於兩個元素的margin能夠相互接觸到。因為兄弟元素之間外邊距是無法阻隔的，是肯定會直接接觸的。所以兄弟元素之間像是新增邊框或者內邊距是無法解決垂直外邊距合併問題的。
兄弟元素之間垂直外邊距合併問題，可以設定兄弟元素都float或者display:inline-block等。
此外也可以利用外邊距合併這一特點，兄弟元素之間需要多大間隔，直接給其中乙個元素設定margin就行。
垂直外邊距合併問題
簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。實際工作中，垂直外邊距合併問題常見於第乙個子元素的margin top會頂開父元素與父元素相鄰元素的間距，而且只在標準瀏覽器下 firffox chrome ope...
垂直外邊距合併問題
別被上面這個名詞給嚇倒了，簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。你可以檢視w3shool css外邊距合併了解這個基本知識。實際工作中，垂直外邊距合併問題常見於第乙個子元素的margin top會頂開父...
CSS 外邊距合併
做了個div 巢狀div的實驗，父div和子div都有margin邊距 發現margin top 10px 根本不起作用，後來發現是外邊框合併問題，他會合併取兩者大的邊距，如果子div的邊距是30px 那麼父子div還是會貼著 只是，父div外邊距會變成30的效果 外邊距合併指的是，當兩個垂直外邊距...