CSS 高度百分比不起作用
嘗試將元素的高度指定為百分比時,它可能無法如預期顯示。這是因為百分比高度是相對於其父元素的。因此,將所有父元素的高度設為 100% 至關重要。
在提供的程式碼片段中:
<div>
問題是由於缺少高度聲明而產生的父元素,即body和html元素。如果沒有此聲明,div 的百分比高度將被解釋為相對於其父級的預設高度(通常不會設定)。
要解決此問題,請將body 和html 元素的高度明確設定為100% ,確保它們佔據整個視窗:
html, body { height: 100%; width: 100%; margin: 0; }
透過將html 和body 元素設定為100% 高度,div 元素現在能夠正確計算其高度基於其父級的高度,現在是視口的100%。因此,div 將正確顯示,其高度跨越瀏覽器視窗的整個高度。
以上是為什麼我的 CSS 百分比高度不起作用?的詳細內容。更多資訊請關注PHP中文網其他相關文章!