在animation和transition兩個屬性中，cubic-bezier是控制變化的速度曲線。
cubic-bezier(<x1>,<y1>,<x2>,<y2>)

從上圖中我們可以看到，cubic-bezier有四個點：
兩個默認的，即：P0(0,0)，P3(1,1)；
兩個控制點，即：P1(x1,y1)，P2(x2,y2) （這是我們設(shè)置的兩個點）
注：X軸的范圍是0~1，超出cubic-bezier將失效，Y軸的取值沒有規(guī)定，但是也不宜過大。
我們只要調(diào)整兩個控制點P1和P2的坐標，最后形成的曲線就是動畫曲線。

常用預(yù)設(shè)屬性

1. linear cubic-bezier(0,0,1,1) / cubic-bezier(1,1,0,0)
2. ease cubic-bezier(0.25,0.1,0.25,1)
3. ease-in cubic-bezier(0.42,0,1,1)

總結(jié)

css3動畫的速率曲線并不需要了解貝塞爾曲線的核心內(nèi)容，靠兩個控制點去調(diào)整?；緀asings.net給出的緩動函數(shù)能滿足大部分的動畫需求了。
用了一圈發(fā)現(xiàn)其實還是ease最好用

參考

貝塞爾曲線——cubic-bezier詳解
緩動函數(shù)