如何防止 Margin-Top 影響無邊框父元素？

解決CSS Margin-top 在無邊框父元素中的問題

當父元素沒有上邊框時，子元素的margin- top 可能會導致父元素向下移動。此問題可以透過為父元素添加上邊框來解決，但這違反了原始要求。

然而，有一種替代解決方案，可以防止這種情況發生：

應用overflow:auto 到父元素

透過將overflow: auto 應用到父元素，您可以強制其容器包含其內容，從而防止margin-collapsing。 margin-collapsing 是 CSS 中的一個行為，它將相鄰邊距合併為一個邊距。

在給定的範例中，您可以將以下CSS 加到.body 類別：

.body {
  overflow: auto;
}

這將阻止margin-top 導致.body 下移，同時保持其頂部無邊框。

參考

• [W3C CSS2 規格：邊距摺疊](http://www.w3.org/TR/CSS2/box.html# collapsing-margins)

以上是如何防止 Margin-Top 影響無邊框父元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！