设置html{background-color:blue}，为什么却能铺满整个页面? <html>的height并没有这么设置这么高

为什么背景色能铺满整个页面？
<html>元素此时的height只有8px啊(这8px还是body的外边距撑开的) 



先看代码



<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>

</body>
</html>



/* 
    为什么背景色能铺满整个页面？
    <html>元素此时的height只有8px啊(这8px还是body的外边距撑开的) 
*/
html{
  background-color: lightblue;
  border:2px solid red;
}



运行结果

图片说明



另外,经常看到这种写法,结合上面的例子展示的特性,感觉也挺奇怪的:
html,body{
    height:100%;
}

当html标签无背景样式时，body的背景色其实不是body标签的背景色，而是浏览器的。一旦html标签含有背景色，则body的背景色变成正常的body标签的背景色，而此时html标签最顶级，背景色被浏览器获取，成为浏览器的背景色。

https://www.zhangxinxu.com/wordpress/2009/09/%E5%AF%B9html%E4%B8%8Ebody%E7%9A%84%E4%B8%80%E4%BA%9B%E7%A0%94%E7%A9%B6%E4%B8%8E%E7%90%86%E8%A7%A3/

html应该不行，它永远都是满屏幕的，试试看body或者div/p这些。

将html换成body试试看