css3旋转、过渡、动画属性

1、transform

该属性对元素进行旋转、缩放、移动和倾斜

translate元素从当前位置移动

rotate元素顺时针旋转

scale元素的尺寸增大或减小

skew元素翻转

2、transition

元素从一种样式逐渐变为另一种,该属性一般加载鼠标悬浮时的效果,鼠标移出时会逐渐变为原来的样式

第一个参数transition-property表示css属性的名称

第二个参数transition-duration表示过渡效果需要的时间

第三个参数transition-timing-function表示效果的速度曲线

第四个参数transition-delay表示过渡效果开始的时间

它时animation的简化版本,只能设置两帧即开始和结尾

3、animation

创建动画效果,从一个状态变为另一个状态,只有css属性值为数字值时才可以创建动画效果

animation(styles,option)

styles:表示产生动画效果的css样式,css样式要使用驼峰式(如font-size要用fontSize),option表示动画的额外效果

option包含的值

speed:动画的值

easing:

原文地址:https://www.cnblogs.com/lhyhappy365/p/9182865.html