色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css屬性animation-name

朱佳欣1年前7瀏覽0評論

animation-name是CSS中用于指定動畫名稱的屬性。通過這個屬性可以為CSS動畫指定一個名稱,方便其他CSS屬性調用。

/*定義一個名為move的動畫*/
@keyframes move {
from {left: 0;}
to {left: 100px;}
}
/*調用名為move的動畫*/
div {
animation-name: move;
}

在上述代碼中,我們通過@keyframes關鍵字定義一個名為move的動畫,該動畫從left為0的位置開始移動,直到left為100px的位置結束。接著,我們將該動畫調用到div標簽中,通過animation-name屬性將動畫名稱指定為move。

需要注意的是,動畫名稱需要使用英文字母、數字、下劃線等組成,并且不能以數字開頭。如果同時定義了多個動畫,可以通過animation-name屬性來依次調用。

/*定義兩個名為move和spin的動畫*/
@keyframes move {
from {left: 0;}
to {left: 100px;}
}
@keyframes spin {
from {transform: rotate(0deg);}
to {transform: rotate(360deg);}
}
/*依次調用兩個動畫*/
div {
animation-name: move, spin;
animation-duration: 3s, 2s; /*設置動畫持續時間*/
animation-timing-function: ease-in-out, linear; /*設置動畫速度曲線*/
animation-iteration-count: infinite, 3; /*設置動畫循環次數*/
}

在上述代碼中,我們定義了兩個名為move和spin的動畫,并依次調用到div標簽中。通過animation-duration屬性可以設置動畫持續時間,通過animation-timing-function屬性可以設置動畫速度曲線,通過animation-iteration-count屬性可以設置動畫循環次數。

總的來說,animation-name屬性是CSS動畫中比較核心的屬性之一,通過該屬性可以為動畫指定一個名稱,并方便其他CSS屬性進行調用。