HTML基础：为什么div不能扩展到100%

我不明白为什么这个片段不能扩展到100%的屏幕…有人知道吗…我想是的…我只是不明白，这里有一把小提琴：

无标题文件
身体{
宽度：100%；
高度：100%；}
.科{
身高：100%；
宽度：100%；
背景色：#000；
}

使用：

---

您可以尝试添加到HTMLDOM元素。没有任何内容很难说

*{width:100%;height:100%;}

---

在html、正文和部分（如果想要拉伸整个视口）上使用属性

width:100%

，是不情愿的，或者是不需要的，因为默认情况下，它们都拉伸到整个视口。

---

您可以设置所需像素的高度，如

高度：所需像素

，也可以使用不间断空格

这是定位的本质。默认情况下，元素设置为

位置：static

，这基本上表示元素将在文档中出现时进行定位。因此，在

body

元素中定义的百分比高度必须遵守

html

元素设置的高度规则。在这种情况下，基本上是默认的空元素高度。如果您注意到，将主体上的位置设置为“绝对”或“固定”会突然扩展框（而“相对”不会）。这是因为您正在将其从页面的正常流中删除

然而，正如大多数人所指出的，设置html的高度/宽度和body元素将解决这个问题，这是我的建议。事实上，在我做的大多数页面上，我通常从以下内容开始：

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

---

这将基本上为您在页面主体内部提供完整的窗口空间。

顺便说一句，您可以将CSS放入JSFIDLE中右上角的框中。它将自动应用所有这些。

*{width:100%;height:100%;}

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