新！我的 44 頁電子書「44 分鐘精通 CSS」已經出版了！ 😃

立即取得 →

#transition

transition-property transition-duration transition-timing-function 和 transition-delay 的簡寫屬性。

僅 需要 transition-duration。

transition: 1s;

  • transition-duration 設定為 1s
  • transition-property 預設為 all
  • transition-timing-function 預設為 ease
  • transition-delay 預設為 0s

transition: 1s linear;

  • transition-duration 設定為 1s
  • transition-property 預設為 all
  • transition-timing-function 設定為 linear
  • transition-delay 預設為 0s

transition: background 1s linear;

  • transition-duration 設定為 1s
  • transition-property 設定為 background
  • transition-timing-function 設定為 linear
  • transition-delay 預設為 0s

transition: background 1s linear 500ms;

  • transition-duration 設定為 1s
  • transition-property 設定為 background
  • transition-timing-function 設定為 linear
  • transition-delay 設定為 500ms

transition: background 4s, transform 1s;

您可以結合多個屬性與其本身的轉場時間。