Wie erreicht man mit CSS browserübergreifenden vertikalen Text?

Browserübergreifender vertikaler Text mit CSS

Abfrage: Wie kann Text vertikal um einen 90-Grad-Winkel gedreht werden, um die Kompatibilität zwischen verschiedenen zu gewährleisten Browser (IE6, Firefox 2, Chrome, Safari, Opera)?

Lösung:

Die Zu den neuesten Weiterentwicklungen gehören die CSS3-Eigenschaften -webkit-transform, -moz-transform und transform. Ihre Syntax lautet:

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

Für ältere Browser kann der Legacy-IE-Filter verwendet werden über:

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

Zusätzlich gilt für Firefox 3.5 oder höher und WebKit/Safari 3.1 oder höher: Die Eigenschaften -moz-transform und -webkit-transform können verwendet werden:

-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%;

Das obige ist der detaillierte Inhalt vonWie erreicht man mit CSS browserübergreifenden vertikalen Text?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!