transition :

Geçiş efektleri uygulamak için kullanılır.

Örnek

div {
  background: green;
  width: 200px;
  height: 20px;
  transition: height 2s;
  -webkit-transition: height 2s; /* Safari 3.1 to 6.0 */
}
div:hover {
  height: 100px;
}

Codepen Ön izleme

Css Sözdizimi

Değer	Açıklama
transistion-property	Uygulanan geçiş efektinin elemanın hangi özelliği üzerinden yapılacağını belirlemek için bu özelliği kullanırız.
Transistion-duration	Geçiş efektlerini uygularken verdiğimiz efektin ne kadar süre ile devam edeceğini ayarlamak için kullanılır.
Transistion-timing-function	Oluşturacağımız geçişlere daha estetik geçişler sağlamak için kullanılan fonksiyonlardır.
Transistion-delay	Uygulanan geçiş efektinin ne kadar zaman sonra başlayacağını belirler. Belirlenen zamana kadar animasyonu durdurur ve sonra animasyon başlar.
İnital
İnherit

Tarayıcı Desteği

26.0 4.0-webkit	16.0 4.0-moz	10.0	6.1 3.1-webkit	12.1 10.5-o