:dir()

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

Resumen

La pseudo-class CSS :dir sirve para seleccionar elementos basándonos en la direccionalidad de los textos que contienen. En HTML, la dirección viene determinada por el atributo dir . Para otros tipos de documentos puede que haya otros métodos para determinar el lenguage.

Destacar que el uso de la pseudo-class :dir() no es equivalente al uso de los selectores de atributo [dir=…]. Este último selecciona un valor del dir y no hace ninguna selección si el atributo no está establecido,incluso si en ese caso el elemento hereda se su padre; de manera similar [dir=rtl] or [dir=ltr] no serán seleccionados con un valor auto  que puede ser usado en el atributo dir. Por el contrario, :dir() seleccionará el valor calculado por el UA, siendo heredado o con un valor auto.

De igual manera :dir() sólo considera el valor semántico  de la direccionalidad, aquel definido en el documento, la mayoría del tiempo en HTML. No tiene en cuenta la direccionalidad establecida con estilo, aquella fijada con propiedades CSS como direction que son puramento estilísticas.

Síntaxis

/* element:dir(directionalidad) { propiedades de estilo}
   donde la direccionalidad es ltr o rtl */

div:dir(ltr) { /* propiedades de estilo */ }
span:dir(rtl) { /* propiedades de estilo */ }

Ejemplos

<div dir="rtl">
  <span>test1</span>
  <div dir="ltr">test2
    <div dir="auto">עִבְרִית</div>
  </div>
</div>

En este ejemplo :dir(rtl) seleccionará el div de nivel superior, el span que contiene test1, y el div con los caracteres en hebreo. :dir(ltr) seleccionará el div que contienetest2.

Especificaciones

Especificación Estado Comentario
WHATWG HTML Living Standard
The definition of ':dir(ltr)' in that specification.
Living Standard SIn cambios
Selectors Level 4
The definition of ':dir()' in that specification.
Working Draft Definición Inicial

Compatibilidad con los distintos navegadores.

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Soporte básico No support 17 (17) -moz No support No support No support
Característica Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico No support 17.0 (17) -moz No support No support No support

Ver además

  • Pseudo-classes relacionadas con el idioma: :lang, :dir

Etiquetas y colaboradores del documento

 Colaboradores en esta página: pekechis
 Última actualización por: pekechis,