设置了 rotate(90deg)，但为什么方向没有改变呢？必须将它加到动画r 里么？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>2-9</title>
<style type="text/css">
div {
/*border:1px solid black;*/
font-family: Arial;
font-size: 16px;
font-weight: bold;
position: fixed;
bottom:10px;
left:50%;
margin-left:-10px;
margin: 0 auto;
transform: rotate(90deg);
/*此处写代码*/
transition: transform 0.1s linear 0s;
animation:r 1.5s linear 0s infinite alternate;
}
@keyframes r {
0%{
transform: translateX(0px);
}
25% {
transform: translateX(10PX);
}
50% {
transform: translateX(7px);
}
75% {
transform: translateX(10px);
}
100% {
transform: translateX(0px);
}
}
</style>
</head>
<body>
<div>></div>
</body>
</html>
正在回答
同学你好，是的，必须把rotate写在动画r中才行，因为rotate是transform的属性值，r中设置的transform属性会把div的transform属性覆盖，导致div没有旋转，因此需要将rotate写在r中，例如：
如果我的回答帮到了你，望采纳，祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星