Rotação de texto - CSS-Tricks

Anonim

Se o que você está procurando é uma maneira de definir o tipo verticalmente, a melhor opção é provavelmente o CSS writing-mode.

Se você está apenas tentando girar um texto, pode girar elementos inteiros assim, que gira 90 graus no sentido anti-horário:

.rotate ( transform: rotate(-90deg); /* Legacy vendor prefixes that you probably don't need… */ /* Safari */ -webkit-transform: rotate(-90deg); /* Firefox */ -moz-transform: rotate(-90deg); /* IE */ -ms-transform: rotate(-90deg); /* Opera */ -o-transform: rotate(-90deg); /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); )

A propriedade de rotação do filtro BasicImage do Internet Explorer pode aceitar um dos quatro valores: 0, 1, 2 ou 3 que irão girar o elemento 0, 90, 180 ou 270 graus, respectivamente.

Veja também esta postagem do blog sobre cabeçalhos laterais.

Veja os
cabeçalhos Pen Sideways de Chris Coyier (@chriscoyier)
no CodePen.

Veja a
Rotação do Cabeçalho Lateral da Caneta por Graham Clark (@Cheesetoast)
no CodePen.