Maison >interface Web >tutoriel CSS >Comment obtenir du texte vertical multi-navigateur avec CSS ?

Comment obtenir du texte vertical multi-navigateur avec CSS ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-21 18:25:22633parcourir

How to Achieve Cross-Browser Vertical Text with CSS?

Texte vertical multi-navigateur à l'aide de CSS

Requête : Comment le texte peut-il être pivoté verticalement jusqu'à un angle de 90 degrés, garantissant ainsi la compatibilité entre différents navigateurs (IE6, Firefox 2, Chrome, Safari, Opera)?

Solution :

Les dernières avancées incluent les propriétés -webkit-transform, -moz-transform et transform de CSS3. Leur syntaxe est :

transform: rotate(-90deg);
transform-origin: 50% 50%;

Pour les navigateurs plus anciens, l'ancien filtre IE peut être utilisé via :

filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

De plus, pour Firefox 3.5 ou version ultérieure et WebKit/Safari 3.1 ou version ultérieure, les propriétés -moz-transform et -webkit-transform peuvent être utilisées :

-moz-transform: rotate(270deg); /* Use 270 degrees for negative angle */
-moz-transform-origin: 50% 50%;
-webkit-transform: rotate(270deg); /* Use 270 degrees for negative angle */
-webkit-transform-origin: 50% 50%;

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:
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