我有以下html页面:
null
<!DOCTYPE html>
<html lang="en">
<head>
<style>
html,body {
height: 100%;
}
body {
margin: 0;
}
</style>
</head>
<body style="margin: 0 auto;text-align:center;background: linear-gradient(to bottom, #243B55, #141E30);">
<p style="font-family: Montserrat; font-style: normal; font-weight: bold; color: rgba(255, 255, 255, 0.92);font-size: 30px;">Text</p>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
</body>
</html>null
我知道我在样式标签中添加的CSS负责使线性渐变在您滚动页面时‘重复’，但是有没有一种方法使线性渐变背景在整个滚动过程中保持一致，而不必移除现有的CSS（我愿意添加CSS），因为我知道我将需要现有的CSS做其他事情？
您需要使要设置背景的元素的高度等于文档的全部高度
你的想法是对的，你只需要改变一下
如果属性height:100%；确实是必要的，您可以添加一个包装器并将其添加到包装器中。
// from
html,body {
height: 100%;
}
//to
html,body {
height: auto;
}
null
<!DOCTYPE html>
<html lang="en">
<head>
<style>
html,body {
height: auto;
}
.wrapper {
height: 100%;
}
body {
margin: 0;
}
</style>
</head>
<body style="margin: 0 auto;text-align:center;background: linear-gradient(to bottom, #243B55, #141E30);">
<div class="wrapper">
<p style="font-family: Montserrat; font-style: normal; font-weight: bold; color: rgba(255, 255, 255, 0.92);font-size: 30px;">Text</p>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
a
<br>
</div>
</body>
</html>