animation動畫

CSS animation動畫

1. transform: rotate3d(0,0,1,-5deg) 第四個參數是什麼意思呢。

最後一個标示旋轉的角度。

• animation-name	規定需要綁定到選擇器的 keyframe 名稱。。
  animation-duration	規定完成動畫所花費的時間，以秒或毫秒計。
  animation-timing-function	規定動畫的速度曲線。
  animation-delay	規定在動畫開始之前的延遲。
  animation-iteration-count	規定動畫應該播放的次數。infinite
  animation-direction	規定是否應該輪流反向播放動畫。 normal|alternate;

animation-fill-mode : none | forwards | backwards | both;      

none	不改變預設行為。
forwards	當動畫完成後，保持最後一個屬性值（在最後一個關鍵幀中定義）。
backwards	在 animation-delay 所指定的一段時間内，在動畫顯示之前，應用開始屬性值（在第一個關鍵幀中定義）。
both	向前和向後填充模式都被應用。

animation-timing-function      

linear	動畫從頭到尾的速度是相同的。	測試
ease	預設。動畫以低速開始，然後加快，在結束前變慢。
ease-in	動畫以低速開始。
ease-out	動畫以低速結束。
ease-in-out	動畫以低速開始和結束。
cubic-bezier(n,n,n,n)	在 cubic-bezier 函數中自己的值。可能的值是從 0 到 1 的數值。