<p >
<h1 style="margin-top:100px">aa</h1>
</p>
有個問題不明白,
1.html裡面p包裹一個h1,h1有margin-top, 為什麼h1的margin-top會撐破到p外面去,而不是在p裡面實現外邊距
2.如何實現在p裡面謝謝.
程式碼示範
連結描述
PHPz2017-05-19 10:49:56
根據jasonintju的回答,我整理一下:
因為我的子元素的margin-top比父元素大,所以會直接使用子元素的margin-top
區塊級父元素與其第一個/最後一個子元素
如果區塊級父元素中,不存在上邊框、上內補、inline content、 清除浮動這四條屬性(對於上邊框和上內補,也可以說,當上邊距及上內補寬度為0時),那麼這個區塊級元素和其第一個子元素的上邊距就可以說」挨到了一起「。此時這個塊級父元素和其第一個子元素就會發生上外邊距合併現象,換句話說,此時這個父元素對外展現出來的外邊距將直接變成這個父元素和其第一個子元素的margin-top的較大者。
類似的,若區塊級父元素的margin-bottom 與它的最後一個子元素的margin-bottom 之間沒有父元素的border、padding、inline content、height、min-height、 max-height 分隔時,就會發生下外邊距合併現象。
引用:https://developer.mozilla.org...