CSS perspective Özelliği

CSS perspective

Css perspective özelliği ile 3 boyutlu görünümler elde edilebilir.

Örnek:

Bu örnekte bir kapsayıcı div elemanı içine bir kutu yerleştirilip perspective özelliği uygulanmıştır.

#kutu1 { position: relative; height: 200px; width: 200px; perspective: 200px; -webkit-perspective: 200px; } #kutu2 { position: absolute; transform: rotateX(45deg); -webkit-transform: rotateX(45deg); }

CSS perspective nedir nasıl kullanılır

Perspektif özelliği kodu yazılan elemana değil bir alt soy bağındaki elemanları etkiler.Bu özelliği kullanırken perspective-origin ile kullanılması tavsiye edilir.

CSS perspective	CSS perspective özellikleri
Varsayılan Değer:	none
Kalıtsallık:	yok
Animasyon Özelliği:	var
Versiyon:	CSS3
JavaScript perspective:	object.style.perspective="500px"

CSS perspective Tarayıcı Desteği

Tabloda gösterilen sayılar özelliği ilk destekleyen tarayıcı versiyonlarıdır.

CSS Kodu:
perspective	36.0 12.0 -webkit-	10.0	16.0 10.0 -moz-	9.0 4.0.3 -webkit-	23.0 15.0 -webkit-

CSS perspective Değerleri

perspective:length|none;