1. transition-property:執行變換的屬性
2. transition-duration:執行變換的時間
3. transition-time-function：執行變換的速率
4. transition-delay:執行變換的延遲時間。
1. animation-name:規定需要繫結到選擇器@keyframes的名稱。其主要有兩個值，ident/none。ident是由keyframes建立的動畫名，即此處的indent要和keyframes中的idnet一致。
2. animation-duration:規定動畫完成的時間。
3. animation-time-function:規定動畫曲線。
4. animation-delay:規定動畫開始之前的延遲。
其中：animation-time-function：
1) linear:動畫從頭到結尾速度是相同的
2) ease:預設，動畫以低速開始，然後加快，在結束前變慢。
3) ease-in:動畫以低速開始
4) ease-out:動畫以低速結束
5) ease-in-out：動畫以低速開始和結束。
6) cubic-bezier：又稱三次貝塞爾，主要為animation生成速度曲線的函式，規定是cubic-bezier(,,,)。
從上圖我們需要知道的是cubic-bezier的取值範圍：
其中x軸的取值範圍是0到1，y軸取值沒有規定。
以一條直線放在範圍只有1的座標軸中，並從中間拿出兩個點來拉扯（x軸的取值區間是[0,1]，y軸任意），最後形成的曲線就是動畫的速度曲線。當我們不為transition新增cubic-bezier或是其他timing-function時，預設曲線是ease。此時的速度曲線是：
幾個常用的固定值對應的cubic-bezier值以及速度曲線。
6. in out .back(來回的緩衝效果)：cubic-bezier(0.68,-0.55,0.27,1.55)
animation 類似於transition屬性，他們都是隨著時間改變元素的屬性值。主要區別是transition需要觸發乙個事件（hover事件或者click事件）才會隨時間改變其css屬性，而animation 在不需要觸發任何事件的情況下也可以隨著時間變化來改變元素css的屬性值，從而達到一種動畫的效果。這樣我們就可以直接在乙個元素中呼叫animation 的動畫屬性，基於這一點，css3的animation 就需要明確的動畫屬性值，即我們需要keyframes來定義不同時間的css屬性值，達到元素在不同時間段變換的效果。
@keyframes animationname}
一顆浮躁的心
今天的學習計畫照常進行，但是到學習其他書籍的時候有一種莫名的浮躁感，自己總結了下原因，自己給自己時間上的壓力太大導致心態失穩 自己靜不下心來去學習，又彷彿回到了學校裡填鴨式的灌溉，這很可怕，又讓我覺得對不起自己所解除的知識。看來要慢慢平復心態和鍛鍊自己形成習慣，暫時延遲計畫推行，專心打好基礎，深讀下...
利用Python如何畫一顆心 小人發射愛心
原始碼 usr bin env python coding utf 8 import turtle import time 畫心形圓弧 def hart arc for i in range 200 turtle.right 1 turtle.forward 2 def move pen posit...
未來還有一顆心
生活寫亂了很多，我們學會了忍耐，學會了哭泣，有人傷悲，也有人微笑，在這個世界，懂得的人很少，失去的人很多，我們承受很多的很多，錯過太多，太多，有多少人失去生命，就有幾代人必須失去生命，我們學會，我們失去，我們懂得，我們失去，在乙個世界，你有不知道的，也有做不到的，學會了別人的冷眼旁觀，學會了自己的孤...