margin 外邊距合併問題總結

2022-09-05 18:00:14 字數 735 閱讀 9164

1.只有普通文件流中塊級元素的垂直外邊距才會發生合併,也就是說行內元素不會發生外邊距合併,且合併是發生在垂直方向,水平方向不會發生外邊距合併

2.浮動元素和絕對定位元素也不會發生外邊距合併

發生合併的兩種情形:

(1)當乙個元素出現在另乙個元素上面,則第乙個元素的下邊距和第二個元素 的上邊距會發生合併(合併值取兩者最大值)

(2)當乙個元素包含在另乙個元素中時且兩者間無內邊距padding或者外邊框border分隔開時

(3)當乙個空元素設定外邊距,但沒有設定邊框或填充,上下邊距碰到了一起,則會發生合併,即發生自身合併

margin 外邊距合併問題

外邊距合併指的是,當兩個垂直外邊距相遇時,它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。外邊距合併 疊加 是乙個相當簡單的概念。但是,在實踐中對網頁進行布局時,它會造成許多混淆。簡單地說,外邊距合併指的是,當兩個垂直外邊距相遇時,它們將形成乙個外邊距。合併後的外...

margin外邊距合併問題

margin屬性 所有瀏覽器都支援 margin 屬性。這個簡寫屬性設定乙個元素所有外邊距的寬度,或者設定各邊上外邊距的寬度,也可以分別設定個邊的外邊距。margin是乙個復合屬性,包括 margin top margin bottom margin left margin right 基本使用 例...

margin 外邊距合併問題

一 兄弟元素的外邊距合併 效果圖如下 二者之間的間距為100px,不是150px 二 巢狀元素的外邊距合併 對於兩個巢狀關係的元素,如果父元素中沒有內容或者內容在子元素的後面並且沒有上內邊距及邊框,則父元素的上邊距會與子元素的上外邊距發生合併,且值為最大的那個上外邊距,同時該值作為父元素的上外邊距。...