Maison > interface Web > tutoriel CSS > CSS peut-il retourner le texte horizontalement ? Comment afficher le personnage des ciseaux (✂️) face à gauche ?

CSS peut-il retourner le texte horizontalement ? Comment afficher le personnage des ciseaux (✂️) face à gauche ?

DDD
Libérer: 2024-10-31 09:36:29
original
666 Les gens l'ont consulté

Can CSS Flip Text Horizontally? How to Display the Scissors Character (✂️) Facing Left?

Miroir du texte avec CSS3

Question :

Est-il possible de mettre en miroir du texte en utilisant CSS ou CSS3 ? En particulier, comment pouvez-vous afficher le caractère en ciseaux ("✂") face à gauche au lieu de droite ?

Réponse :

Oui, les transformations CSS vous offrent la possibilité de réaliser cet effet.

  • Retournement horizontal :
<code class="css">-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);</code>
Copier après la connexion
  • Retournement vertical :
<code class="css">-moz-transform: scale(1, -1);
-webkit-transform: scale(1, -1);
-o-transform: scale(1, -1);
-ms-transform: scale(1, -1);
transform: scale(1, -1);</code>
Copier après la connexion

Exemple en direct :

<code class="css">span {
  display: inline-block;
  margin: 1em;
}
.flip_H {
  transform: scale(-1, 1);
  color: red;
}
.flip_V {
  transform: scale(1, -1);
  color: green;
}</code>
Copier après la connexion
<code class="html"><span class='flip_H'>Demo text &#9986;</span>
<span class='flip_V'>Demo text &#9986;</span></code>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal