個人猜測瀏覽器的機制:H5頁面底板上有一張畫布,畫布高度可以被撐高。html、body等元素是固定在畫布上的。瀏覽器中頁面的滾動是跟着畫布滾動的。(fixed定位是脫離這種機制的,相對瀏覽器窗口定位的)
1、html 和 body高度為0為什么背景色能充滿整個瀏覽器 : https://www.sohu.com/a/146413356_230028
瀏覽器的機制,瀏覽器的底板(一般默認是白色,微信上是灰色),畫布是透明的,就近吸收 html 或 body的顏色。html沒有設置顏色,就吸收body的顏色。兩者都沒有就是透明的,看到底板的背景色。
html 和 body 本身設置的背景色是生效的,和div的行為是一樣的。
2、html 和 body 的高度,和div標簽的行為一樣。沒有設置的話,被內容撐開。
3、html 的高度設置100% 后,他的高度就設置成和底板一樣的高度了。即瀏覽器窗口的高度。 參考:https://blog.csdn.net/javaloveiphone/article/details/51098972
4、如果 html 的高度沒有設置100%,body設置100%,是無效的。(css所有的標簽設置百分比高度,其父元素必須要設置一個明確的高度 才有效)
總結:html 和 body 的高度設置100%,即body的高度設置為瀏覽器的高度,子元素的高度超過這個高度,就是溢出的部分。