CSS动画之Tranistion
在以前的浏览器，为了达到丰富的页面表效果，一般会使用FLASH来做一些小动画，便是FLASH这货本身不是浏览器自己亲生，需要有插件支持才能运行，在没有插件的浏览器上就是一片黑，很难看。
CSS3时代的到来，CSS3动画也随之诞生，良好的兼容性（请自动忽视IE9以下→_→）和性能，不使用任何插件，就可以让网页拥有平滑的过渡，丰富的交互，酷炫的动画。而且与HTML5相结合，还可以做出一些有趣的小游戏。
CSS3动画很强大，但简单来说，其实就是两个CSS3的属性，一个是transition,一个是animation。transition不如animation强大，但是做一些元素的过渡，还是非常有用的。
###Transition
语法：transition: property duration timing-function delay;transition 属性是一个简写属性，用于设置四个过渡属性：
- transition-property：规定设置过渡效果的 CSS 属性的名称。
- transition-duration：规定完成过渡效果需要多少秒或毫秒。
- transition-timing-function：规定速度效果的速度曲线。
- transition-delay：定义过渡效果何时开始。
##transition-property
- none: 没有属性会获得过渡效果。
- all:所有改变属性都将获得过渡效果。
- property:定义应用过渡效果的 CSS 属性名称列表，列表以逗号分隔，比如说width,height等。
例子：width有过渡效果:
```bash<!DOCTYPE html>
正文到此结束
热门推荐
相关文章
Loading...
![[HBLOG]公众号](http://www.liuhaihua.cn/img/qrcode_gzh.jpg)
