Comment faire pivoter le texte de 90 degrés vers la gauche en HTML et ajuster la taille des cellules en conséquence ?
Mary-Kate Olsen
Libérer: 2024-10-30 05:28:02
original
170 Les gens l'ont consulté
Comment faire pivoter le texte de 90 degrés vers la gauche et ajuster la taille des cellules en fonction du texte HTML
Pour obtenir l'effet de rotation souhaité tout en en ajustant la taille des cellules en conséquence, envisagez d'utiliser une combinaison de CSS et HTML.
<code class="html"><table>
<tr>
<th><span>Rotated text by 90 deg.</span></th>
</tr>
</table></code>
Copier après la connexion
Dans cette solution :
th { vertical-align: bottom; alignement du texte : centre ; } : Aligne le texte pivoté verticalement et horizontalement dans les cellules.
th span { ...writing-mode: vertical-rl; } : Définit le mode d'écriture du texte sur vertical, lui permettant de le faire pivoter verticalement.
th span { transform: rotate(180deg); } : Fait pivoter le texte de 180 degrés pour qu'il soit orienté vers la gauche.
th span { white-space: nowrap; } : Empêche le texte de s'enrouler, afin qu'il tienne tout sur une seule ligne et ajuste la taille de la cellule en conséquence.
Remarque :
Cette solution nécessite que vous enveloppiez le texte pivoté dans un format élément. Le L'élément n'est nécessaire que pour Chrome car il ne prend pas en charge de manière native la modification de la direction du texte pour
éléments.
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!
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