标签：
1. 转换
transform:
<1>2D转换
translate()
rotate()
scale()
skew() 倾斜
matrix()
<2>3D转换
rotateX()
rotateY()
2. 过渡
transition:
transition-property 过渡名称
transition-duration 过渡时间
transition-timing-function 过渡时间去西安
transition-delay 过渡开始时间
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="mycss.css"> </head> <body> <div>效果展示</div> </body> </html>
div{ width: 100px; height: 100px; background-color: blue; text-align: center; transition: width 2s, height 2s, transform 2s; -webkit-transition: width 2s, height 2s, -webkit-transform 2s; } div:hover{ width: 200px; height: 200px; transform: rotate(360deg); -webkit-transform: rotate(360deg); }
鼠标放在蓝色方块上, 会在2s内完成放大为200px*200px且旋转360度的动作
标签：
原文地址：http://www.cnblogs.com/iMirror/p/4286734.html
