CSS3 tranisition 属性
语法
transition: property duration timing-function delay
transition属性是个复合属性，她包括以下几个子属性：
-
transition-property：规定设置过渡效果的css属性名称 -
transition-duration：规定完成过渡效果需要多少秒或毫秒 -
transition-timing-function：指定过渡函数，规定速度效果的速度曲线 -
transition-delay：指定开始出现的延迟时间
默认值分别为：all 0 ease 0
当 transition-duration 时长为0，不会产生过渡效果
transition 改变多个样式属性
div{
transition: background 0.8s ease-in 0.3s,color 0.6s ease-out 0.3s;
}
子属性
-
transition-property
transition-property: none |all |property;
值为none时，没有属性会获得过渡效果，值为all时，所有属性都将获得过渡效果，值为指定的css属性应用过渡效果，多个属性用逗号隔开
-
transition-duration
transition-duration：time;
该属性主要用来设置一个属性过渡到另一个属性所需的时间，也就是从旧属性过渡到新属性花费的时间长度，俗称持续时间
-
transition-timing-function
transition-timing-function：linear| ease| ease-in| ease-out| ease-in-out| cubic-bezier(n,n,n,n);
该属性指的是过渡的“缓动函数”。主要用来指定浏览器的过渡速度，以及过渡期间的操作进展情况
div {
width: 100px;
height: 100px;
background-color: orange;
margin: 20px auto;
border-radius: 100%;
-webkit-transition-property: -webkit-border-radius;
transition-property: border-radius;
-webkit-transition-duration: 3s;
transition-duration: 3s;
-webkit-transition-timing-function：ease;
transition-timing-function：ease;
div:hover {
border-radius: 0px;
}
