-webkit
-animation:仍舊是乙個復合屬性，
-webkit
-animation: name duration timing-function delay iteration_count direction;
（1） -webkit
-animation
-name 這個屬性的使用必須結合@-webkit
-keyframes一起使用
eg: @-webkit
-keyframes fontchange30%
100%
}百分比的意思就是duration的百分比，如果沒有設定duration的話，則表示為無窮大
div //fontchange是@-webkit-keyframes的name
（2）-webkit
-animation
-duration 表示動畫持續的時間
（3）-webkit
-animation
-timing
-function 表示動畫使用的時間曲線
【語法】： -webkit
-animation
-timing
-function: ease | linear | ease-in
| ease-out
| ease-in
-out
（4）-webkit
-animation
-delay 表示開始動畫之前的延時
【語法】 -webkit
-animation
-delay: delay_time;
（5）-webkit
-animation
-iteration
-count 表示動畫要重複幾次
【語法】-webkit
-animation
-iteration
-count: times_number;
（6） -webkit
-animation
-direction 表示動畫的方向
【語法】-webkit
-animation
-direction: normal(預設) | alternate
normal 方向始終向前
alternate 當重複次數為偶數時方向向前，奇數時方向相反
【另外】跟animation有關的其他屬性
（1）-webkit
-animation
-fill
-mode : none (預設)| backwards | forwards | both 設定動畫開始之前和結束之後的行為（測試結
果不是很清晰）
（2）-webkit
-animation
-play
-state: running（預設） | paused 設定動畫的執行狀態
css樣式:
#div1
@-webkit-keyframes redanimations50%
100%
}@-moz-keyframes redanimations50%
100%
}@keyframes redanimations50%
100%
}js設定div樣式:
function setcssstyle(circlename,bkg,anminationname));
}setcssstyle("div1","#ff0000","redanimations");
純CSS3實現圓圈動態發光特效動畫
效果圖 這個效果的具體實現主要是用到了css3 的animation 它共有8個屬性 animation name 規定 keyframes 動畫的名稱。用來定義乙個動畫的名稱。如果要設定幾個animation給乙個元素，我們只需要以列表的形式，用逗號 隔開 animation duration 動...
CSS 頁面特效
2d 3d特效 transform att webkit transform att safari chrome瀏覽器的適應 o transform att opera ms transform att ie moz transform att firefox 2d translate 移動 rot...
CSS 按鈕特效
通過偽元素實現下圖效果 html rabbitcss body a a after a hover after 想要從中間開始擴張開來，需要偽元素設定position absolute 然後把top和left都設定成50 再通過transform的translate設定回 50 這個作用是讓元素從中...