Html設定html與body元素高度問題

2021-09-30 20:23:03 字數 1060 閱讀 7708

在一些比較正規的**經常見到會設定html與body的高度。是為了後面的div高度正確的顯示。

div的100%是從其上一級div的寬高繼承來的,有一點很關鍵,就是要設定div100%顯示,必須設定其上一級div的寬度或高度,否則無效。

只要為html和body設定高度為100%就可以了html,body這樣之後div會按比例來繼承上一級的高度了.僅僅設定的div元素的height屬性貌似沒有什麼效果。

另外,你問「html是什麼意思呀,難道高度是相對瀏覽器的?」的確,這裡的height:100%是相對於瀏覽器高度來說的。瀏覽器高度不是頁面的高度!

div1

div2

div3

結果:

div1

div2

div3

結果:

-----------------------同時給html與body設定100%----------------------

div1

div2

div3

結果:

總結:

百分比的寬度是相對於其父元素而言,一種方法用單位明確指定父元素的高度,另一種辦法就是上面介紹的從html,body開始用百分比繼承。html的百分比是相對於瀏覽器而言,其他是相對於其父元素而言。也就是說應該養成乙個好的習慣,寫html網頁時候上來就把html,body寫上去。這樣後面的div就可以用百分比起作用了。

Html設定html與body元素高度問題

在一些比較正規的 經常見到會設定html與body的高度。是為了後面的div高度正確的顯示。div的100 是從其上一級div的寬高繼承來的,有一點很關鍵,就是要設定div100 顯示,必須設定其上一級div的寬度或高度,否則無效。只要為html和body設定高度為100 就可以了html,body...

正確認識html與body

標準與非標準模式 standard模式後,定義和解析將更加嚴格,所有定義必須從頂級標籤html開始。可以理解為傳統非standard模式定義body的用法,standard模式下都必須在html上定義。高度100 的意義 認為standard模式下定義容器高度100 無效,是錯誤的理論。如果需要bo...

關於html與body的高度問題

今天看到乙個css樣式 html,body,第一次看到,感覺挺奇怪,為什麼html還需要設定height 100 呢,html不就是整個視窗嗎?我是這樣認為的。然後就把html去掉只剩下body的height 100 麻煩了,頁面內容消失了 頁面裡只有乙個空div通過百分比設定height html...