transition-duration
嘗試一下
transition-duration CSS 屬性指定轉場動畫所需經歷的時間，以秒或是毫秒為單位。默認值為0，表示沒有任何轉場動畫。
你可以指定多個時間長度，每一個時間長度都會被應用在transition-property (en-US) 設定的對應屬性上(which acts as a master list.) 如果指定的時間長度的數量比對應屬性的數量少，那麼時間長度就會被重複使用。反之，多餘的時間長度就會被刪去。而這兩種情況之下的CSS宣告都是有效的。
語法
/* <time> 值 */
transition-duration: 6s;
transition-duration: 120ms;
transition-duration: 1s, 15s;
transition-duration: 10s, 30s, 230ms;
/* 全域值 */
transition-duration: inherit;
transition-duration: initial;
transition-duration: unset;
值
<time><time>(en-US)類型表示轉場動畫從舊狀態轉至新狀態所需要的時間。如果時間長度為0，表示沒有任何轉場，狀態之間會立即改變。若時間長度為負值則無效。
正式語法
transition-duration =
<time> (en-US)# (en-US)
範例
transition-duration: 0.5s
transition-duration: 1s
transition-duration: 2s
transition-duration: 4s
規範
| Specification |
|---|
| CSS Transitions Level 2 # transition-duration-property |
| 預設值 | 0s |
|---|---|
| Applies to | all elements, ::before (en-US) and ::after (en-US) pseudo-elements |
| 繼承與否 | no |
| Computed value (en-US) | as specified |
| Animation type | discrete |
瀏覽器支援情形
BCD tables only load in the browser