rotateY() CSS fonction

Définition de la CSS rotateY().

La fonction de Rotation CSS rotateY() de la propriété de Transformation CSS transform permet de spécifier la rotation à effectuer par rapport à l'axe Y de la perspective sur un élément HTML .

Exemple de syntaxe CSS rotateY() :

transform : rotateY(20deg);
transform : rotateY(-50deg);

La fonction de Rotation CSS rotateY(angle) accepte comme paramètre d'angle :

angle : nombre suivi d'une unité CSS d'angle (deg, rad, grad, turn). Peut être négatif. Dans ce cas, le sens de la rotation se fera vers la gauche au lieu de la droite.
Si l'angle est à 0, c'est la position initiale.

Utilisez le convertisseur d'angles Css pour trouver les équivalences d'un angle en degré, radian, grade (gradian) ou turn (tour).

Exemple de code rotateY() CSS

Conditions d'application de la CSS rotateY().

La fonction de Rotation CSS rotateY est applicable à la propriété de Transformation CSS transform et avec ses propriétés de Transformation préfixées (-moz-transform, -webkit-transform, -ms-transform).

La valeur de la CSS rotateY() peut être mise directement dans la fonction de raccourci CSS rotate3d() ou rotate().

Problème d'interprétation de rotateY() en Css.

La propriété de Transformation CSS transform n'est reconnue par certains navigateurs.

Conditions d'animation de rotateY() en CSS3.

Mettez transform comme valeur de la propriété de Transformation CSS transition-property.

La CSS rotateY() est une fonction de feuille de style qui peut être utilisée pour les animations CSS et transitions CSS.

Règles de syntaxes CSS pour rotateY().

Equivalence avec la fonction de Rotation CSS rotate3d()

Utiliser la fonction de Rotation CSS rotateY() revient utiliser la fonction de Rotation CSS rotate3d() ci-dessous :

Equivalence CSS rotateY()/rotate3d() :

transform : rotateY(angle);
transform : rotate3d(0, 1, 0, angle);

Changer le centre ou point d'origne de la rotation

changement point d'origine pour rotate() Le point de la rotation par défaut correspond au centre de votre élément (50%,50%) et prend pour axe de coordonnés son coin haut gauche.
Le point de la rotation de votre élément peut être modifié avec la propriété CSS transform-origin. Dans l'exemple, on effectue une rotation de 45deg, avec dans l'ordre :

transform-orign utilisé pour l'exemple :

transform-orign : center center;
transform-orign : 0 0;
transform-orign : 45px 45px;

Compatibilités navigateurs de la fonction rotateY()

Détails des versions de la CSS rotateY(): Fonction rotateY() css n'est pas compatible W3C; Fonction rotateY() est compatible avec CSS3 et plus.

Résumé du support navigateurs de la CSS rotateY(): Fonction CSS rotateY() est compatible à partir de Chrome 12; Fonction CSS rotateY() est compatible à partir de Firefox 10; Fonction CSS rotateY() est compatible à partir de Internet Explorer 10; Fonction CSS rotateY() est compatible à partir de Opera 15; Fonction CSS rotateY() est compatible à partir de Safari 4; Fonction CSS rotateY() est compatible à partir de Android Browser 3; Fonction CSS rotateY() est compatible à partir de Internet Explorer mobile 1

Votre avis sur la définition rotateY() en CSS

Votez pour la définition CSS `rotateY()`

Votes: 5 / 5 - 1 vote
Cliquez sur une étoile pour voter.

Définitions annexes à la Css rotateY()

Définitions CSS annexes rotateY()

-moz-transform: La propriété de Transformation CSS -MOZ-TRANSFORM permet de spécifier les transformations 2D et 3D à appliquer à un élément HTML.Exemple d'écriture CS...[ -moz-transform ]
-ms-transform: La propriété de Transformation CSS -MS-TRANSFORM permet de spécifier les transformations 2D à appliquer sur un élément HTML. Exemple d'écriture CSS de...[ -ms-transform ]
-webkit-transform: La propriété de Transformation CSS -WEBKIT-TRANSFORM permet de spécifier les transformations 2D ou 3D à appliquer à un élément HTML. Exemple d'écritur...[ -webkit-transform ]
rotate(): La fonction de Rotation CSS ROTATE() de la propriété de Transformation CSS transform permet de spécifier la rotation à effectuer sur un élément HTML. ...[ rotate() ]
rotate3d(): La fonction de Rotation CSS rotate3d() de la propriété de Transition CSS transform permet de spécifier la rotation à effectuer par rapport à un axe dé...[ rotate3d() ]
transform: La propriété de Transformation CSS TRANSFORM permet de spécifier le type de transformation 2d ou 3d à appliquer sur un élément HTML.Exemple d'écriture...[ transform ]
transform-origin: La propriété de Transformation CSS TRANSFORM-ORIGIN permet de spécifier le point d'origine des transformations 2d ou 3d lors de l'utilisation de la pr...[ transform-origin ]