我看到的是 这个 视频作者 Traversy Media 在那里，他展示了如何制作一个视差网站。在这里，他展示了如何制作视差网站。这个 点，他选择了html，也选择了body标签。我想这两者之间会有什么区别呢，加入html与body标签就显得多余了，因为html中只有body和head，而我们既然是style body，那么所有我们想要style的东西，只要选择body就会被style。所以我一开始没有在代码中写 "html"，结果是：背景图片只是覆盖了元素的背景，额外的部分被隐藏了（根据我的代码，这应该是预料之中的，但我很奇怪为什么我们的结果不同。后来我意识到，我的代码和他的代码是一样的）。) 然后我意识到，选择body和选择html之间是有区别的（我还是不知道区别）。所以我在body后面写了选择html的代码，并将html的高度设置为100%。现在我得到了视频中显示的东西。但我不明白是怎么做到的。根据我的知识，这不应该有什么不同，因为 "body "的高度在代码中被设置为 "100%"。当我删除body的高度时，它就像以前一样工作，即背景图片只覆盖了元素，即使html的高度被设置为100%。我也不明白设置html和body高度的目的。它们不是默认覆盖整个视口吗？
(这是我的第一个问题，如果我需要对问题进行修改，请告诉我，使问题可以解答)
编辑:添加了链接，在第一个代码片段上添加了".pimg1, .pimg2, .pimg3{background-attachment: fixed;}"，在第二个代码片段上添加了".pimg1, .pimg2, .pimg3{background-attachment: fixed;}"（预期的结果，但不希望出现这种情况
我的代码使它按照我的意图工作（希望但不稳定） (预览):
body{
height: 100%;
margin: 0;
font-size: 16px;
font-family: "Lato", sans-serif;
font-weight: 400;
line-height: 1.8em;
color:#666;
}
html{
height: 100%;
}
.pimg1, .pimg2, .pimg3{
background-attachment: fixed;
}
.pimg1{
background-image:url('../img/image1.jpg');
min-height: 100%;
}
.pimg2{
background-image:url('../img/image2.jpg');
min-height: 400px;
}
.pimg3{
background-image:url('../img/image3.jpg');
min-height: 400px;
}
我最初写的代码（预期但不希望） (预览)
body{
margin: 0;
font-size: 16px;
font-family: "Lato", sans-serif;
font-weight: 400;
line-height: 1.8em;
color:#666;
height: 100%;
}
.pimg1, .pimg2, .pimg3{
background-attachment: fixed;
}
.pimg1{
background-image:url('../img/image1.jpg');
height: 100%;
}
.pimg2{
background-image:url('../img/image2.jpg');
min-height: 400px;
}
.pimg3{
background-image:url('../img/image3.jpg');
min-height: 400px;
}
p{
font-size:30px;
}
解决了。我在编辑container div的高度时 以为我只是在编辑背景图片的高度。我太不合逻辑了。我现在明白了。谅谅 https:/stackoverflow.comusers897416charles 和 https:/stackoverflow.comusers8620333temani-afif。