Question

我有一个页面，其中有几个部分占据了屏幕的整个高度和宽度，其思想是用户一次只能看到一个部分，但是在调整窗口大小时，它会显示上一个或下一个部分的一部分：

html, body{
  overflow:hidden;
  scroll-behavior: smooth;
}
section{
  height: 100vh;
  width: 100vw;
  padding: 0;
  margin: 0;
}

#one{
  background-color: yellow;
}

#two{
  background-color: blue;
}

#three{
  background-color: red;
}

<html>
<head>
</head>
<body>
<div class="container"> 
  <section id="one">
    <h1>One</h1>
    <a href="#two">Two</a>
    <a href="#three">Three</a>
  </section>
  <section id="two">
    <a href="#one">One</a>
    <h1>Two</h1>
    <a href="#three">Three</a>
  </section>
  <section id="three">
    <a href="#one">One</a>
    <a href="#two">Two</a>
    <h1>Three</h1>
  </section>
</div>
</body>
</html>

调整窗口大小时，如何避免看到其他部分的内容？我想始终将重点放在我当前所在的部分上（如果我是两个人，并且调整大小，则看不到一部分）

调整窗口大小时，将焦点保持在当前部分中

0 个答案: