rotateX() CSS fonction

Définition de la CSS rotateX().

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

Exemple de syntaxe CSS rotateX() :
transform : rotateX(20deg);
transform : rotateX(-50deg);
La fonction de Rotation CSS rotateX(angle) accepte comme paramètre d'angle :

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

Conditions d'application de la CSS rotateX().

La fonction de Rotation CSS rotateX est applicable à la propriété de Transformation CSS et avec ses propriétés de Transformation préfixées (, , ).

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

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

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

Conditions d'animation de rotateX() en CSS3.

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

La CSS rotateX() 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 rotateX().

Equivalence avec la fonction de Rotation CSS rotate3d()

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

Equivalence CSS rotateX()/rotate3d() :
transform : rotateX(angle);
transform : rotate3d(1, 0, 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 . 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 rotateX()

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

Votez pour la définition CSS rotateX()

  • 1/5
  • 2/5
  • 3/5
  • 4/5
  • 5/5

Avis sur la page https://www.zonecss.fr/proprietes-css/rotatex-css-fonction.html Votes: 5 / 5 - 1 vote
Cliquez sur une étoile pour voter.