1. 程式人生 > >css3動畫效果

css3動畫效果

rds 數值 耗時 無限 mil 動畫效果 for 函數 rect

添加動畫效果:

1 animation-name:指定動畫名稱 2.animation-duration:設置動畫的總耗時 3.animation-duration:設置的動畫的播放次數,默認為1次,可以指定具體的數值,也可以指定infinite(無限次) 4.animation-direction:alternate :社會交替動畫 alternate來回交替 5.animation-delay:2s 這是動畫的延遲 設置動畫結束時的狀態:默認情況下,動畫執行完畢之後,會回到原始狀態animation-fill-mode:both || forwards || backwards forwards:會保留動畫結束時的狀態,在有延遲的情況下,並不會立刻進行到動畫的初始狀態 backwards:不會保留動畫結束時的狀態,在添加了動畫延遲的前提下,如果動畫有初始狀態,name會立刻進行到初始狀態 both:會保留動畫的結束時狀態,在有延遲的情況下也會立刻進入到動畫的初始狀態 animation-tining-function:linear 勻速的 動畫的事件函數 animation-play-state:running || paused 播放 || 暫停 創建動畫 @keyframes dong(動畫名字) { 0%{
transform:translate( ) ....... } || from相當於0% 50%{ } 。。。。。 100%{ } || to{ } to相當於100% }

css3動畫效果