<!doctype html><html><head><meta charset="utf-8"><title>animation 动画效果</title><style>div{ font-family:Arial; font-size:72px; font-weight:bold; position:fixed; left:0; right:0; bottom:25px;;width:30px; height:30px; margin:auto; transform:rotate(90deg); animation:jt 0.3s infinite alternate 0.5s running;}@keyframes jt{ from{ transform:translate(0,10px)} to{ transform:translate(0,0)} }</style></head><body><div>></div></body></html>
1 回答
已采纳
woshiajuana
TA贡献211条经验 获得超152个赞
因为你animation动画有transform ,他覆盖了你之前的那个transform:rotate旋转属性
解决方法的话,
@keyframes jt{
from{ transform: rotate(90deg), translate(0,10px)}
to{ transform: rotate(90deg), translate(0,0)}
}
- 1 回答
- 0 关注
- 1523 浏览
添加回答
举报
0/150
提交
取消