1、过渡的理解
（1）概念
- 过渡是css3中的新特性之一，可以让我们在不使用flash动画和js的情况下，当元素从一种样式转换为另外一种样式的的时候为元素添加效果
- 过渡动画：从一个状态渐渐地过渡到另一个状态的过程
（2）属性
- 花费时间：单位s，必须写
- 运动曲线：默认是ease，可省略
- 何时开始：单位s，必须写；可以设置延时触发事件，默认是0，可省略
2、过渡的应用
（1）不添加过渡效果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script></script> <style> div { width: 300px; height: 300px; background-color: aqua; } div:hover { width: 340px; background-color: blue; } </style> </head> <body> <div> </div> </body> </html>
（2）添加过渡效果：
<style> div { width: 300px; height: 300px; background-color:aqua; transition: width 1.5s; } div:hover{ width: 340px; background-color: blue; } </style>
在鼠标经过的时候是一个渐变的过程：
（3）同时更改两个属性：
<style> div { width: 300px; height: 300px; background-color:aqua; transition: width 1.5s 1s,height 1.5s 1s; } div:hover{ width: 340px; height: 340px; background-color: blue; } </style>
效果展示：
简化写法：表示变化所有的属性
<style> div { width: 300px; height: 300px; background-color:aqua; transition: all 1.5s 1s; } div:hover{ width: 340px; height: 340px; background-color: blue; } </style>
3、html5
广义的html5是html5本身和css3和js组成的