一.過渡
1.定義：將CSS的屬性值在一段時間內平緩變化的過程給體現出來；
2.指定過渡屬性
2.1作用：指定哪個或者哪幾個屬性值，在變化時需要使用過渡效果來體現；
2.2屬性：transition-property取值：屬性名 例子：transition-property:background;
2.3注意：允許設置過渡效果的屬性如下
顏色屬性，取值爲數字的屬性，轉換屬性（transform），漸變屬性，陰影屬性，visibility屬性
3.指定過渡時長
3.1作用：指定在多長時間內完成過渡操作
3.2 屬性：transition-duration 取值：s/ms
4.指定過渡速度時間函數
4.1屬性 transition-timing-function
4.2取值：（1）默認值，ease表示慢速開始快速變化 慢速結束（2）linear勻速（3）ease-in 慢速開始 勻速結束（4）ease-out 快速開始慢速結束（速率與1不同）（5）ease-in-out 慢速開始和結束
5.指定過渡延遲時間 transition-delay:時間
6.過渡的編寫位置
6.1允許將過渡屬性編寫在元素聲明的樣式中;
6.2 觸發過渡效果樣式中（hover）
二．動畫
1.定義：使元素從一種樣式逐漸變化爲另一種樣式，動畫是複雜的過渡效果。動畫是通過關鍵幀來控制動畫的每一步。
關鍵幀：在某個時間點上，元素的狀態和樣式是怎樣的。
2.動畫的使用步驟：
2.1聲明動畫：
@keyframes 動畫名稱{
/* 定義該動畫中所有的關鍵楨*/
0%{動畫開始時的樣式}
100{動畫結束時的樣式}
}
3.動畫屬性
3.1 animation-name 指定動畫的名稱
3.2 animation-duration 指定動畫執行的一個週期的時長
3.3animation-timing-function
3.4 animation-delay
3.5animation-iteration-count 作用：指定動畫的播放次數；取值：1.具體數值；2.infinite 無限次
3.6.animation-direction 指定動畫的播放方向；normal 正常播放 alternate輪流播放，偶數次時正向播放，奇數次時逆襲播放
動畫的簡潔寫法：animation: name duration timing-function delay iteration-countdirection
3.7 animation-fill-mode
定義：規定動畫在播放前和播放後的狀態；
取值：3.7.1 none：默認行爲 不改變；3.7.2 forwards當動畫完成後，保持在最後一個幀的狀態上；3.7.3 backwards 在動畫播放前的延遲時間內，動畫將保持在第一幀的狀態；3.7.4 both: forwards+backwards
3.8 animation-play-state:指定動畫的播放狀態
取值：pasuse 動畫暫停；running: 動畫播放