A propriedade text-orientation do CSS

Definição e uso

text-orientation A propriedade especifica a direção do caractere.

Nota:Apenas quando writing-mode É eficaz apenas quando definido como vertical.

Exemplo

Exemplo 1

Defina a direção do texto para diferentes elementos <div>:

div.a {
  text-orientation: mixed;
}
div.b {
  text-orientation: upright;
}

Experimente você mesmo

Exemplo 2

text-orientation A propriedade pode ser usada para alterar a direção da cabeça da tabela:

th {
    writing-mode: vertical-lr;
    text-orientation: upright;
}

Experimente você mesmo

Sintaxe do CSS

text-orientation: mixed|upright|sideways|sideways-right|use-glyph-orientation|initial|inherit;

Valor da propriedade

Valor Descrição
mista Valor padrão. O caractere é rotacionado 90 graus no sentido horário.
upright O caractere não roda, mantendo-se ereto.
sideways A direção do caractere é a mesma que a direção da linha de texto quando o writing-mode é vertical, ou seja, rotação de 90 graus no sentido horário.
sideways-right igual ao valor da propriedade sideways. Mantido para fins de compatibilidade.
use-glyph-orientation Usado para elementos SVG, para que o texto herde as propriedades SVG obsoletas glyph-orientation-vertical e glyph-orientation-horizontal.
initial Defina essa propriedade como seu valor padrão. Veja initial.
inherit Herda essa propriedade do elemento pai. Veja inherit.

Detalhes técnicos

Valor padrão: mista
Herança: sim
Produção de animação: Não suportado. Veja:Propriedades relacionadas a animação.
Versão: CSS3
Sintaxe do JavaScript: object.style.textOrientation="upright"

Suporte do navegador

Os números na tabela representam a versão do navegador que suporta completamente essa propriedade.

Chrome Edge Firefox Safari Ópera
48.0 79.0 41.0 14.0 35.0

Páginas relacionadas

Referência:A propriedade writing-mode do CSS