我想要做的是当我向下滚动时，让一个直接位于 body 中的 div 延伸到视口之外。现在，当我向下滚动页面底部时，内容会“过度滚动”，显示正文的背景。我希望 div 的背景在那里可见。
我搜索了几个小时的解决方案，但找不到任何东西，所以我尝试将 margin-bottom 设置为负值，但无济于事。
这是带有示例文本和样式标签而不是单独的样式表文件的代码：
<!DOCTYPE html>
<html>
<head>
<style>
body{
background-color: red;
}
.content {
margin: 2% 10%;
margin-bottom: -1000px;
padding: 5% 5%;
background-color: #404040;
color: lightgrey;
overflow: visible;
}
</style>
</head>
<body>
<div class="content">
<p>Content</p>
<p>spanning</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>lines</p>
</div>
</body>
</html>首先，您需要删除 body 的默认边距，然后像这样显式为 div 的每一侧提供边距
<!DOCTYPE html>
<html>
<head>
<style>
body{
background-color: red;
margin: 0;
}
.content {
margin: 2% 10% 0 10%;
padding: 5% 5%;
background-color: #404040;
color: lightgrey;
}
</style>
</head>
<body>
<div class="content">
<p>Content</p>
<p>spanning</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>many</p>
<p>lines</p>
</div>
</body>
</html>在你的情况下，你不需要 div 中的溢出，因为你希望你的身体滚动，这里是更新的代码。 希望它能解决您的问题。
有几个简单的选择，第一个是使用伪元素来携带背景颜色（或背景图像），如下所示：
:root {
--main-inline-size: 80%;
--main-max-inline-size: 1200px;
--main-min-inline-size: 20rem;
--spacing: 0.5rem;
}
*,
::before,
::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
block-size: 100vh;
font-family: system-ui;
padding-block: 12rem;
/* the background for the page: */
background-color: lightpink;
}
menu,
ol,
ul,
li {
list-style-type: none;
}
main {
inline-size: clamp(var(--main-min-inline-size), var(--main-inline-size), var(--main-max-inline-size));
margin-inline: auto;
min-block-size: 100%;
padding: var(--spacing);
/* to have the absolutely-positioned pseudo-element positioned in relation to this
element: */
position: relative;
}
main::before {
/* the content property must have a value set for the pseudo-element to
be rendered to the page: */
content: '';
/* we're using absolute positioning: */
position: absolute;
/* using inset to position the top, and bottom, edges of the
element 50vh above and below the edges of the parent element;
and zero distance from either the left or right edge:
*/
inset: -50vh 0;
/* the background-color: */
background-color: #ddf9;
/* using a negative z-index to position the background behind the content of
the element: */
z-index: -1;
}<main>
<header>
<h1>Lorem ipsum dolor</h1>
<p>Arbitrary header tagline text</p>
</header>
<section>
<h2>Ipsum dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi. Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis, commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
<section>
<h2>Dolor sit</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi. Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis, commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
<section>
<h2>Sit anet</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi. Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis, commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
</main>或者，我们可以使用 CSS 自定义属性并简单地将背景渐变应用于
<body>:root {
--bleedColor: hsl(300deg 90% 85% / 1);
--inlineBorderSize: 0.2rem;
--inlineInset: 10rem;
/*
if you want the 'bleed' to be at the edges of the content of
the relevant element, then the padding of that element can be
listed below; if none is supplied the default value of 0px
will be used: */
--inlinePadding: 0px;
}
*,
::before,
::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
--_inlineStart: calc(var(--inlineInset) + var(--inlineBorderSize) + var(--inlinePadding) - var(--inlineBorderSize));
--_inlineEnd: calc(100% - var(--_inlineStart));
background-color: lightpink;
background-image: linear-gradient( 90deg, transparent 0 var(--_inlineStart), var(--bleedColor) var(--_inlineStart) var(--_inlineEnd), transparent var(--_inlineEnd));
block-size: 100vh;
font-family: system-ui;
}
menu,
ol,
ul,
li {
list-style-type: none;
}
main {
border: var(--inlineBorderSize) solid currentColor;
min-block-size: 100%;
margin-block: 12rem;
margin-inline: var(--inlineInset);
padding-inline: var(--inlinePadding);
}<main>
<header>
<h1>Lorem ipsum dolor</h1>
<p>Arbitrary header tagline text</p>
</header>
<section>
<h2>Ipsum dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet
odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum
reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi.
Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis,
commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae
aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut
atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur
magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint
vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam
quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam
aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde
numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat
reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore
illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
<section>
<h2>Dolor sit</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet
odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum
reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi.
Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis,
commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae
aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut
atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur
magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint
vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam
quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam
aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde
numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat
reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore
illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
<section>
<h2>Sit anet</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque porro accusantium omnis cum harum, asperiores tempora cumque itaque quidem possimus sapiente nihil, aliquam error obcaecati quam ea totam fugiat impedit suscipit, fuga dolores eveniet
odit? Maxime necessitatibus accusamus dolores ea optio quae quaerat iure error. Inventore, cum, ratione. In perspiciatis, saepe. Perspiciatis quibusdam assumenda dolor, ut quae, molestiae deserunt vitae? Accusantium in nulla odio sint commodi eum
reprehenderit quis iusto maiores, autem, tempora ut enim praesentium repudiandae vel magni omnis. Repudiandae veritatis dolorem libero minima nam, tempora quae ex commodi, eligendi placeat rem accusamus repellendus in sequi fugit nesciunt excepturi.
Natus numquam dolorum aliquam atque non neque voluptatum illum quidem quod adipisci consequuntur cum similique, saepe doloremque est modi. Odio eum ex sunt qui nihil ipsum fugit quidem est mollitia necessitatibus accusamus cumque tempore illo omnis,
commodi delectus tenetur excepturi, voluptas eligendi rem! Culpa, possimus repudiandae harum esse, corrupti sunt nemo ratione est sequi doloremque velit provident neque quam impedit. Esse placeat libero distinctio, temporibus deleniti dolor recusandae
aliquid tempora. Maxime nesciunt natus harum nulla aspernatur dolorem, impedit nemo pariatur et consequuntur, quasi sapiente velit neque dolores. Expedita adipisci dolores aliquam quo, provident iure, ea nostrum, laboriosam a esse dolorum enim aut
atque, sed voluptas dolorem! Voluptatem similique rerum error quas perferendis et, obcaecati reiciendis nemo, debitis. Saepe nostrum veniam tenetur recusandae! Quam nesciunt cum, atque id ipsa quisquam rerum aut, voluptatum iusto odio consectetur
magni omnis, labore! Laboriosam et vero, ab officiis nostrum obcaecati? Dolorem est optio consequatur magnam, dignissimos, dolor aliquam maxime rem. Modi vitae doloribus tempore voluptatibus minus, deserunt quae a blanditiis dolorum minima, sint
vel sed, autem possimus delectus fugit accusantium ducimus! Magni doloremque, maiores eius nesciunt est tempore quod deserunt sapiente sit illo minus modi rem dolor! Doloremque aspernatur quaerat, aperiam vero sapiente voluptatem numquam. Ipsa veniam
quos doloribus error veritatis nam ratione alias, corporis nostrum nihil dicta delectus molestias deleniti numquam explicabo earum porro repellendus asperiores inventore! Deserunt debitis ipsum ipsa numquam veritatis, dolore modi sint quibusdam
aperiam possimus at ea adipisci itaque nihil sequi repudiandae, iusto soluta distinctio ad minima nam quasi consequuntur earum? Voluptas sed accusamus laborum dignissimos iure quod, tempore perspiciatis impedit eius libero sunt voluptate autem unde
numquam architecto, voluptatibus aliquid natus praesentium, aspernatur similique ipsam minima ea ratione. Velit dolor ut accusamus reiciendis nam aliquid, aspernatur, architecto, eum consectetur amet corrupti asperiores tenetur, numquam. Est quaerat
reiciendis animi voluptatum voluptatibus eius neque maxime corporis, unde illum impedit quae aspernatur aliquid error dignissimos tenetur ipsum vitae earum nemo molestiae quas facere magnam. Accusantium officia, odio illo! Iusto velit inventore
illo, distinctio, et repellat, aut possimus consequatur dolor commodi architecto. Possimus unde dolores nulla, ullam culpa, obcaecati nostrum neque illo doloremque?</p>
</section>
</main>事实证明，仅当在 Windows 11 的 Firefox 版本 116.0.2 或可能更早的版本中使用触摸板或触摸屏滚动时，才会出现此问题
编辑：可以通过将 apz.overscroll.enabled 设置为 false 在 about:config 中关闭它