當兩個盒子(兄弟元素)處於垂直狀態時,相鄰兩個外邊距不是相加,而是取最大值
當兩個元素是父子關係時,子元素的外邊距(父元素的外邊距)會傳遞給對方
解決方法1: 使用文字破壞外邊距相鄰
破壞相鄰狀態
缺點:需要增加html結構
解決方法2: 使用border破壞外邊距相鄰
缺點:需要維持可見框大小
解決方法3: 不是用外邊距,轉而去調整內邊距(padding)
缺點:需要維持可見框大小
終極版:解決方法: clearfix類封裝
/* 解決外邊距重疊 */
.clearfix::before
外邊距重疊
外邊距重疊 在css當中，相鄰的兩個盒子 可能是兄弟關係也可能是祖先關係 的外邊距可以結合成乙個單獨的外邊距。這種合併外邊距的方式被稱為摺疊，並且因而所結合成的外邊距稱為摺疊外邊距。摺疊結果遵循下列計算規則 1.兩個相鄰的外邊距都是正數時，摺疊結果是它們兩者之間較大的值。也就是說當第乙個div的ma...
垂直外邊距合併問題
簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。實際工作中，垂直外邊距合併問題常見於第乙個子元素的margin top會頂開父元素與父元素相鄰元素的間距，而且只在標準瀏覽器下 firffox chrome ope...
垂直外邊距合併問題
別被上面這個名詞給嚇倒了，簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。你可以檢視w3shool css外邊距合併了解這個基本知識。實際工作中，垂直外邊距合併問題常見於第乙個子元素的margin top會頂開父...