當子元素有margin-top 並且其父元素缺少上邊框時，子元素元素的邊距可能會造成視覺上的不一致。如提供的圖像所示，橙色 div 似乎將綠色 div 向下推，儘管後者沒有頂部邊框。
要解決此問題而不向父 div 添加邊框，您可以實現防止邊距崩潰的解決方案。邊距折疊是一種 CSS 行為，當相鄰元素（在本例中為綠色和橘色 div）的邊距折疊成單一邊距時會發生這種行為。
要防止邊距折疊，請將以下CSS 加到父元素：
overflow: auto;
將overflow:auto應用於所提供的CSS片段中的.body將防止邊距折疊並保持所需的視覺排列。您可以在 W3C 規範中找到有關邊距折疊的更多詳細資訊：http://www.w3.org/TR/CSS2/box.html#collapsing-margins
以上是如何防止具有「margin-top」的子 Div 和沒有頂部邊框的父 Div 之間的邊距崩潰？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
