0.環境準備
（1）過渡需要瀏覽器的支持，使用這些屬性要加上瀏覽器廠商的前綴，我用的chrome49已經不需要前綴了，
-o- Opera
-webkit- Safari、Chrome
-moz- Firefox
-ms- IE
(2) css
p
{
height:15px;/*類似於高度這種屬性,必須明確指定值*/
}
p:hover/*初始p:hover*/
{
height:100px;
}
(3)html文件body部分
1.快速使用
將下面屬性加入初始p:hover
transition: background 2s linear 1s,height 1s linear 1s;
2.詳解
(1)分別指定、屬性詳解
將下面屬性加入初始p:hover
transition-property:height,background-color;
transition-duration:1s,2s;
transition-timing-function:linear;
transition-delay:1000ms,1s;
transition-property 指定需要變化的屬性
不建議寫成all,規則很難捉摸
transition-duration height從執行到結束是1s,background-color從執行到結束是2s,height變化結束後,background-color變化結束還剩1s
只寫一個值,則所有屬性應用這個值,除此之外,請讓transition-duration值的個數等於transition-duration值的個數
transition-timing-function:linear;變化的規律,這裡請自行查找
只寫一個值,則所有屬性應用這個值,除此之外,請讓transition-timing-function值的個數等於transition-property值的個數
transition-delay:1000ms,1s;height 1s後開始變化,這裡background-color和height同時開始變化
只寫一個值,則所有屬性應用這個值,除此之外,請讓transition-delay值的個數等於transition-property 值的個數
這些屬性只能出現一次，否則後面的覆蓋前面的
(2)綜合使用
將下面屬性加入初始p:hover
transition: background 2s linear 1s,height 1s linear 1s;
可選參數,請全寫
這些屬性只能出現一次，否則後面的覆蓋前面的
*transition和其他分著寫的過渡睡醒也存在覆蓋,後面覆蓋前面的
