Thi*_*tre 4 html css css-position absolute
我有两个<div>与position: absolute. 一个位于页面顶部，另一个位于页面底部。页面底部的元素低于最后一个元素（页脚）。我的问题是，即使我<div>在position: absolute流中并且应该从流中删除，我的页面<div>也会扩展以适应“溢出”的页面。如何让页面裁剪超出页脚的所有内容？
这就是我要说的：
body{
position: relative;
}
p{
width: 80%;
font-size: 50px;
margin: 0;
}
footer{
margin-top: 200px;
position: relative;
}
.bg_gradient.first{
position: absolute;
top: 0;
left: 0;
width: 1000px;
height: 1000px;
transform: translate(-400px, -400px);
background: radial-gradient(circle, rgba(254,73,70,1) 0%, rgba(254,73,70,0) 70%);
z-index: -1;
}
.bg_gradient.last{
position: absolute;
bottom: 0;
left: 0;
width: 1000px;
height: 1000px;
transform: translate(-400px, 400px);
background: radial-gradient(circle, rgba(254,73,70,1) 0%, rgba(254,73,70,0) 70%);
z-index: -1;
}<body>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum voluptas incidunt nulla necessitatibus rerum illum provident ea earum neque officia nam deserunt animi nostrum iusto velit distinctio, dolor eveniet voluptates.</p>
<div class="bg_gradient first"></div>
<div class="bg_gradient last"></div>
<footer>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere eligendi maiores dolore mollitia animi a fugit saepe perferendis unde, sequi debitis sint ratione, recusandae tempora quis culpa vitae sed assumenda!</p>
</footer>
</body>