CSS3动画中的animation有关的一些属性和@keyframes

CSS3动画中的animation有关的一些属性和@keyframes
文献种类：专题技术文献；
开发工具与关键技术： DW，CSS3
作者：刘任锋 ；年级： 2020级 ；撰写时间： 2021 年 1 月 17 日
01.CSS3里animation中的缩放的效果；

把animation名命为change1,运动过程时间为3秒，运动轨迹为匀速，运动次数为无限次。

使用@keyframes，使用百分比调试运动过程的参数。分别为开始1倍大小，中间0.5倍大小，最后回到1倍.

从而实现一个简单的圆圈放大和缩小的动画，CSS3中的scale()属性.2d缩放和放大.
02.CSS3动画中实现一个旋转动画.

把animation名命为change1,运动过程时间为3秒，运动轨迹为匀速，运动次数为无限次。
使用@keyframes，使用百分比调试运动过程的参数。分别为开始为0度，中间向右旋转90度，最后回到0度.




从而实现一个简单的正方形旋转动画效果，CSS3中的rotate()属性，2d旋转属性.
其他有关2D动画的一些属性总结：

03…CSS3动画中实现一个3D立体旋转的动画效果。
使图片沿着中心Y轴做3D旋转运动。






把animation名命为change1,运动过程时间为3秒，运动轨迹为匀速，运动次数为无限次。
使用@keyframes，使用百分比调试运动过程的参数。分别为开始为0度，中间沿Y轴旋转90度，最后回到0度.
从而实现一个简单的正方形旋转动画效果，CSS3中的rotateY()属性，3D旋转属性.

使图片沿着中心X轴做3D旋转运动。






把animation名命为change1,运动过程时间为3秒，运动轨迹为匀速，运动次数为无限次。
使用@keyframes，使用百分比调试运动过程的参数。分别为开始为0度，中间沿X轴旋转90度，最后回到0度.
从而实现一个简单的正方形旋转动画效果，CSS3中的rotateX()属性，3D旋转属性.
其他有关3D动画效果属性总结：

End!
谢谢观看.2021/1/17 23:52.