body只能被元素撑起，background无法覆盖整个HTML 和设置padding之后出现滚动

 本来的问题如图，body没有完全覆盖html，只能被元素撑起。

问题是没有给HTML和body设置高度，默认为0。

解决办法很简单，给两个都加上高度和宽度。

html,body{
  height: 100%;
  width: 100%;
  margin: 0;
}

 但是因为我给body设置了pading，结果出现了滚动条，原因和方法链接里写的很清楚了。

https://blog.csdn.net/zr15829039341/article/details/79564408

我最后选择了第二种解决办法：

html,body{
  height: 100%;
  width: 100%;
  margin: 0;
}

body {
  padding: 50px;
  background-color: #66CCFF;
  font-family: sans-serif;
  box-sizing: border-box;
}

还是基础不牢固的问题啊。