CSS Dersleri 41 - 3 Boyutlu Dönüşümler (3D Transforms)


Merhaba değerli Kodlama Vakti takipçileri, bu dersimizde CSS'de 3 Boyutlu Dönüşümler ve Transform Kullanımı Konusunu öğreneceğiz.

CSS transform özelliği ile aşağıdaki 3B dönüştürme metotlarını kullanabilirsiniz:

  • rotateX()
  • rotateY()
  • rotateZ()

CSS rotateX() kullanımı

CSS'de rotateX() metodu, bir etiketi belirli bir derecede X ekseni etrafında döndürmemize olanak sağlar.

#box{
  transform: rotateX(150deg);
}

CSS rotateY() kullanımı

CSS'de rotateY() metodu, bir etiketi belirli bir derecede Y ekseni etrafında döndürmemize olanak sağlar.

#box{
  transform: rotateY(150deg);
}

CSS rotateZ() kullanımı

CSS'de rotateZ() metodu, bir etiketi belirli bir derecede Z ekseni etrafında döndürmemize olanak sağlar.

#box{
  transform: rotateZ(90deg);
}