https://www.xuanmo.xin/1303.html

css3 过渡transition属性

发布于 分类:

CSS3

0 1415

transition是css3新增属性,可不用JavaScript、jQuery、flash等实现一些动画,以下为个人笔记:
transition:简写属性,一共4个值;
  transition-property:css属性名,width、height…;
  transition-duration:过渡需要花费的时间,默认为0;
  transition-timing-function:运动曲线;共6个值:linear(匀速)、ease(慢速开始,然后加快,慢速结束)、ease-in(慢速开始)、ease-out(慢速结束)、ease-in-out(慢速开始,慢速结束)、cubic-bezier(cubic-bezier函数中自定义值)默认为ease;
  transition-delay:定义何时执行过渡,默认为0,无延时。
推荐一个cubic-bezier可视化网站:http://cubic-bezier.com
DEMO展示

Xuanmo

作者专栏:Xuanmo

一名前端爱好开发者,欢迎我们成为朋友!

发表评论

电子邮件地址不会被公开。 必填项已用*标注

https://www.xuanmo.xin/wp-content/themes/xuan/expression.php
表情
贴图
表情加载中...

换一张

已经没有了!

插入图片

上传进度:

1303 https://www.xuanmo.xin/wp-content/themes/xuan

点击添加图片