transition-property :

Uygulanan geçiş efektinin elemanın hangi özelliği üzerinden yapılacağını belirlemek için transition-property özelliğini kullanırız.

Not: Her zaman geçiş özelliğinin süresini belirtin yoksa varsayılan süre o olduğu için hiçbir geçiş göremezsiniz.

İpucu: Bir geçiş özelliği bir elementin üzerinin üzerindeyken genellikle kullanıcı elementin üzerine gelmeden hiçbir geçiş gözükmez.

Örnek

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

Codepen Ön izleme

 

Css Sözdizimi

Değer	Açıklama
none	Hiçbir geçiş efektinin gözükmemesini sağlar.
all	Tüm özellikleri almış bir geçiş efekti uygulanır.
property	Uygulanan geçiş efektinin elemanın hangi özelliği üzerinden yapılacağını belirlemek için transition-property özelliğini kullanırız.
İ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