transition-duration :

Geçiş efektlerini uygularken verdiğimiz efektin ne kadar süre ile devam edeceğini belirlemek için kullanılır.

Örnek

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

Codepen Ön izleme

 

Css Sözdizimi

Değer	Açıklama
Time	Geçiş efektinin ne kadar saniye veya milisaniye devam edeceğini belirtir. Varsayılan süre 0s olduğu için süre ayarı yapılmazsa hiçbir geçiş gözükmez.
İ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