注册 登录
编程论坛 WEB前端(UI)

transition过渡属性

elsyyzh 发布于 2015-11-28 16:42, 1579 次点击
一个动作的完成如果没有过度阶段就会显得很生硬,也很不美观,那么今天我们介绍的这个属性就是过度属性transition,这个标签的作用就是让动作有个过渡的过程。

1. transition过渡属性:

过渡元素是元素从一种形态逐渐改变为另一种效果

(1) 规定希望吧效果添加到哪个css3属性上

(2) 规定效果的时长

2. transition其他转换属性

transition-property 规定应用过渡效果的css属性名称

transition-property:none | all | property;

none:没有属性获得过渡效果

all:所有属性获得过渡效果

property:定义应用过渡效果的的css属性名称列表,列表以逗号分隔



transition-duration 定义过渡效果花费的时间,默认值为0



transition-timing-function 规定过渡效果的时间曲线,默认值“ease”

linear:规定以相同速度开始至结束的过渡效果

ease-in:规定以慢速开始的过渡效果

ease-out:规定以慢速结束的过渡效果

ease-in-out:规定以慢速开始和慢速结束的过渡效果

cubic-bezier(n,n,n,n):自定义过渡效果的值
0 回复
1