我正在创建一个网站，使用动画div来创建一个漂亮的背景，但是当它们动画时，它会产生溢出，这使得网站非常无响应，特别是在较小的屏幕上。如何防止动画div在x轴和y轴上产生溢出?它只是用作背景元素，但当它旋转
时，它会在x轴和y轴上产生溢出。<body>
<div class="animated-div"></div>
<div>
<!-- Rest of the website goes here -->
</div>
</body>
我使用基本的CSS关键帧来动画它，像这样:
.animated-div {
height: 34vmax;
aspect-ratio: 1;
position: absolute;
left: 70%; /* Used to position the div*/
top: 60%; /* Used to position the div*/
translate: -50% -50%;
animation: rotate 10s infinite;
}
@keyframes rotate {
from {
rotate: 0deg;
}
50% {
scale: 1 1.3;
}
to {
rotate: 360deg;
}
}
此外，我不能使用overflow:hidden;，因为它的网站是可滚动的。
尝试.animated-div{position: fixed;}在CSS文件和重新安排你的顶部和左侧，比较固定位置