Atributo text-orientation de CSS

Definición y uso

text-orientation La propiedad especifica la dirección del carácter.

Nota:Sólo cuando writing-mode Es efectivo solo cuando se establece en vertical.

Ejemplo

Ejemplo 1

Establezca la dirección del texto para diferentes elementos <div>:

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

Pruebe usted mismo

Ejemplo 2

text-orientation La propiedad se puede usar para cambiar la dirección de los encabezados de la tabla:

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

Pruebe usted mismo

Sintaxis de CSS

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

Valor del atributo

Valor Descripción
mezclada Valor predeterminado. El carácter se rota 90 grados en el sentido de las agujas del reloj.
upright El carácter no se rota, se mantiene erguido.
sideways La dirección del carácter es la misma que la dirección de la línea de texto cuando writing-mode es vertical, es decir, se rota 90 grados en el sentido de las agujas del reloj.
sideways-right igual al valor de la propiedad sideways. Se mantiene para propósitos de compatibilidad.
use-glyph-orientation Se utiliza para elementos SVG, para que el texto herede las propiedades SVG obsoletas glyph-orientation-vertical y glyph-orientation-horizontal.
initial Establezca este atributo en su valor predeterminado. Véase initial.
inherit Hereda este atributo del elemento padre. Véase inherit.

Detalles técnicos

Valor predeterminado: mezclada
Herencia: sí
Producción de animación: No se admite. Consulte:Atributos relacionados con la animación.
Versión: CSS3
Sintaxis de JavaScript: object.style.textOrientation="upright"

Compatibilidad del navegador

Las cifras en la tabla representan la versión del navegador que admite completamente la propiedad.

Chrome Edge Firefox Safari Opera
48.0 79.0 41.0 14.0 35.0

Páginas relacionadas

Referencia:Atributo writing-mode de CSS