Properti Transition CSS adalah properti singkatan untuk mengatur properti long-hand: Transition-properti, Transition-durasi, Transition-timing-function, dan Transition-delay.

Urutan properti dalam properti transisi adalah penting, dan harus memiliki urutan yang sama seperti yang disebutkan di atas. Nilai pertama yang dapat diuraikan sebagai waktu ditugaskan ke durasi transisi, dan nilai kedua yang dapat diuraikan sebagai waktu ditugaskan untuk transisi-delay.

Kalian dapat menentukan salah satu transisi dalam property Transition, atau beberapa Transition yang dipisahkan koma. Sebagai contoh:

Jika kalian menetapkan lebih dari satu transisi dan salah satu transisi tidak memiliki transisi sebagai properti, maka deklarasinya tidak valid.

 

Penulisan Official Syntax

 

  • Initial: tidak ada 0s memudahkan 0s; yang merupakan gabungan dari nilai awal dari masing-masing properti longhand.
  • Applies To: Semua Element; dan ::beforeserta ::after pseudo-element.

 

Berikut ini mendefinisikan dua transisi pada suatu elemen: memindahkan posisinya dan mengubah background-color ketika itu berpindah. Transisi perubahan dalam Background-color terjadi setelah transisi posisi.