老师看一下这样写对吗
来源:2-18 编程练习
一心励志当码农
2021-04-29 17:21:05
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>2-9</title>
<style type="text/css">
div {
font-family: Arial;
font-size: 72px;
font-weight: bold;
position: fixed;
right: 0;
left: 0;
width: 30px;
height: 30px;
bottom: 30px;
margin: auto;
transform: rotate(90deg);
/*此处写代码*/
animation: r 1s linear 0.5s alternate infinite;
}
@keyframes r {
from {
bottom: 30px;
}
to {
bottom: 10px;
}
}
</style>
</head>
<body>
<div>></div>
</body>
</html>
1回答
同学你好,代码实现的效果还可以,但效果图中该动画执行时有“顿一下”的效果,建议优化一下,参考如下:
祝学习愉快!
相似问题