html - 如何使页面的特定部分适合所有分辨率的 100% 屏幕，同时保持向下滚动的能力？

Question

我最近才开始编码，所以很多事情我都不是特别确定 - 甚至我使用的是什么程序。 HTML 和 CSS 有什么区别？

无论如何，回到手头的问题:如何使页面的特定部分适合所有分辨率的 100% 屏幕，同时保持向下滚动的能力？这是网址:http://youns.gitastudent.online/

我正在努力使“计算机科学:Gita 1”框在所有分辨率的页面上居中，但滚动功能仍然存在。如果用户单击下面的按钮，会将页面向下滚动到“八月”标题。

我在网站的最底部还有另一个按钮，可以将页面拉回顶部，但我注意到它从来没有真正将它拉到顶部。我仍然可以向上滚动 5-10 个像素 - 这是有原因的吗？我该如何解决这个问题？

<div class="main" id="Top"></div>
</br></br></br></br></br></br>

<hr width="90px" size="1" color="silver">
<hr width="200px" size="1" color="silver">
<hr width="525px" size="1" color="silver">
<div id="box1" class="Style7">
. . .
</div>
<h1 id="box2"></br>Computer Science: Gita 1</h1>
<div id="box2" style="line-height:20px">
</br>
</div>
<div id="box2" class="Style2">
This is my website for Computer Science 1. We are learning C#</br>which is used for making Windows apps.
This is my first year of programming, but</br>some day I would like be able to program my own apps from scratch.
</div>
<div id="box3" class="Style2">
</br>
</div>
<div id="box4" class="Style7">
. . .
</div>
</br>
<hr width="525px" size="1" color="silver">
<hr width="200px" size="1" color="silver">
<hr width="90px" size="1" color="silver">

</br></br></br></br></br></br>

<div class="Style2">
Projects
</div>
<div class="Style6">
-
</div>
<div><a href="#Projects"><button class="button1">﹀</button></a></div>

</br></br></br></br></br>
<div id="Projects"></div>
<div id="box6" class="Style4" align="center">
</br>
August
</br>
</br>
</div>
</br></br>

Answer 1

要覆盖整个页面的宽度，您需要提供 width: 100vw;这意味着它将覆盖视口(viewport)宽度，你也应该考虑研究 HTML 标签的使用对于顶部的按钮你提供了id #top在<center>不是真正位于顶部的标签。当你检查它时，你将能够看到。并且，尝试给出 id #top在body .它会一直向上滚动。