<body>
<div></div>
</body>
<style>
body {
position: relative;
}
div {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
background-color: bisque;
border-radius: 30px;
/* 旋转重点 */
animation: rotate 1s linear infinite;
}
/* 定义旋转动画 */
@keyframes rotate {
from {
transform: translate(-50%, -50%) rotate(0deg);
}
to {
transform: translate(-50%, -50%) rotate(360deg);
}
}
</style>
版权声明:本文为Sleepless_er原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。