<style> /** scale、rotate、translate 已经可以从 transform 的函数变为属性，skew 保留原样， 本示例演示元素使用 transform: rotate 做关键帧动画之后依然可以独立使用相关属性 */ @import 'https://638183.freep.cn/638183/web/tz/tz.e.css'; .son { position: absolute; width: 200px; height: 160px; border: 1px solid gray; display: grid; place-items: center; } .son:nth-child(2) { animation: rot 8s linear infinite; /* transform: scale(2); 这个无效，与上句冲突，transform: translate/skew 同理 */ scale: 2; /* scale: 2 1.5 也是合法的*/ translate: 200px -100px; /* skew: 45deg; 这个无效，目前没有 skew 属性 */ transition: rotate 1s; } .son:nth-child(2):hover { /* 鼠标指针滑入时还可以使用 rotate 属性 */ rotate: 1 -0.5 0.5 180deg; } </style> <div id="pa" class="pa"> <div class="son">son No.1 - 200 * 160<br><br>I'm very quiet.</div> <div class="son">son No.2 - scale: 2<br><br><br>and rotating</div> </div>