Margin-Top 將Div 向下推:解決方案揭曉
將上邊距應用於頁面上的第一個可見元素可能會導致整個包含div 向下移動。這在標題部分尤其明顯。若要解決此問題,請將下列 CSS 屬性套用至父 div:
overflow: auto;
此屬性允許父 div 自動適應子元素上邊距導致的高度增加。
這是一個包含解決方案的修改後的範例程式碼片段:
div#header{ width: 100%; background-color: #eee; position: relative; overflow: auto; } div#header h1{ text-align: center; width: 375px; height: 50px; margin: 50px auto; font-size: 220%; background: url('../../images/name_logo.png') no-repeat; }
透過添加溢位:auto屬性,#header div將自動擴展以適應高度h1 元素,防止其將整個標題向下推。
以上是為什麼上邊距會壓低我的 Div,我該如何解決?的詳細內容。更多資訊請關注PHP中文網其他相關文章!