La dirección del texto
La propiedad direction
La dirección del texto puede ser especificada en CSS utilizando la propiedad direction.
La propiedad direction puede tomar uno de estos valores:
- -
ltracrónimo de "left to right" o sea: de izquierda a derecha. Esto corresponde a la dirección normal del texto en español y otros idiomas que utilizan el alfabeto latino. - -
rtlacrónimo de "right to left" o sea: de derecha a izquierda. - -
initialy - -
inherit
p.rtl {
direction: rtl;
}
p.ltr {
direction: ltr;
}
de derecha a izquierda!
de izquierda a derecha!
de derecha a izquierda!
de izquierda a derecha!
El atributo dir
También podemos especificar la dirección del texto en el HTML utilizando el atributo dir. Exactamente como en el caso de la propiedad dirección el atributo dir puede tomar uno de estos valores:
- -
ltracrónimo de "left to right" o sea: de izquierda a derecha - -
rtlacrónimo de "right to left" o sea: de derecha a izquierda - -
auto: deja al navegador que decida la dirección del texto.
See the Pen El atributo dir by Gabi (@enxaneta) on CodePen.
La pseudo clase :dir
La pseudo clase :dir() se utiliza para seleccionar y dar formato a texto que tiene especificado el atributo dir.
See the Pen El atributo dir by Gabi (@enxaneta) on CodePen.
Por ahora esto funciona solo en Firefox y solo con prefijo -moz- ( En el ejemplo de arriba estoy utilizando la libreria -prefix-free). Chrome lo está considerando ( Chrome status: Proposed ). Mientras tanto como que se trata de elementos que llevan el atributo dir, podemos seleccionar estos elementos utilizando selectores para atributos:
p[dir='rtl']{color:red;}
p[dir='ltr']{color:green;}