本文同時發表在https://github.com/zhangyachen/zhangyachen.github.io/issues/38

瀏覽器根本就不計算內容的高度，除非內容超出了視窗范圍(導致滾動條出現)。或者你給整個頁面設置一個絕對高度。否則，瀏覽器就會簡單的讓內容往下堆砌，頁面的高度根本就無需考慮。

因為頁面并沒有缺省的高度值，所以，當你讓一個元素的高度設定為百分比高度時，無法根據獲取父元素的高度，也就無法計算自己的高度。換句話說，父元素的高度只是一個缺省值：height: auto;。當你要求瀏覽器根據這樣一個缺省值來計算百分比高度時，只能得到undefined的結果。也就是一個null值，瀏覽器不會對這個值有任何的反應。

解決方法：給父元素設置一個高度的有效值

參考：http://www.webhek.com/css-100-percent-height

轉載于:https://www.cnblogs.com/zhangyachen/p/8035683.html

總結

以上是生活随笔為你收集整理的CSS height:100%无效的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。