javascript - 為什麼BFC可以解決margin疊加問題?
phpcn_u1582
phpcn_u1582 2017-05-19 10:25:45
0
1
707

http://jsfiddle.net/gothic/B6E8F

不是說兩個或多個毗鄰的普通流中的塊元素垂直方向上的 margin 會折疊,那麼這個例子違反了哪個條件?

phpcn_u1582
phpcn_u1582

全部回覆(1)
曾经蜡笔没有小新

w3.org關於margin合併的規範說明

Two margins are adjoining if and only if:

  • both belong to in-flow block-level boxes that participate in the same block formatting context

  • no line boxes, no clearance, no padding and no border separate them

  • ...

margin要從屬於相同的BFC中的塊級盒子,overflow: hidden 創建了一個新的 BFC,所以自然就不會折疊了。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板