Aanbevolen cursus:

CSS rotateY() functie

Definitie en gebruik rotateY() CSS

rotateY() De functie definieert de 3D-rotatie van het element om de y-as (verticale richting). transform Gebruik in eigenschappen.

Voorbeeld

Voorbeeld 1

Gebruik rotateY() Roteer meerdere <div>-elementen om de y-as (verticale richting):

#myDiv1 {
  transform: rotateY(40deg);
}
#myDiv2 {
  transform: rotateY(60deg);
}
#myDiv3 {
  transform: rotateY(80deg);
}

Probeer het zelf

Voorbeeld 2

Gebruik rotateY() Roteer de afbeelding om de y-as (verticale richting):

#img1 {
  transform: rotateY(40deg);
}
#img2 {
  transform: rotateY(60deg);
}
#img3 {
  transform: rotateY(80deg);
}

Probeer het zelf

CSS syntaxis

rotateY(hoek)
Waarde Beschrijving
hoek

Verplicht. Specificeer de rotatieradius. Mogelijke eenheden:

  • deg（graad）
  • rad（hoekmaat）
  • turn（cirkel）

Technische details

Versie: CSS Transforms Module Level 2

Browserondersteuning

De cijfers in de tabel vertegenwoordigen de browserversie die de functie volledig ondersteunt.

Chrome Edge Firefox Safari Opera
12 12 10 4 15

Gerelateerde pagina's

Handleiding:CSS 3D Transformaties

Referentie:CSS transform eigenschap

Referentie:CSS rotate eigenschap

Referentie:CSS rotate() functie

Referentie:CSS rotate3d() functie

Referentie:CSS rotateX() functie

Referentie:CSS rotateZ() functie