martes, 27 de noviembre de 2012

Selectores CSS3 ^=, $= y *=

 En la nueva definición de las hojas de estilo en cascada CSS3 se agregan nuevos selectores, así como nuevas pseudo-clases y pseudo-elementos. En cuanto a selectores, se añaden 3 nuevos selectores de atributos: ^=, $= y *=.



  • elemento[atributo^="valor"]: selecciona todos los elementos que disponen de ese atributo y cuyo valor comienza exactamente por la cadena de texto indicada.
  • elemento[atributo$="valor"]: selecciona todos los elementos que disponen de ese atributo y cuyo valor termina exactamente por la cadena de texto indicada.
  • elemento[atributo*="valor"]: selecciona todos los elementos que disponen de ese atributo y cuyo valor contiene la cadena de texto indicada.
Algunos ejemplos:

/*selecciona todos los enlaces que tienen el atributo class y comienza por icon*/
a[class^="icon"]{...}

/*selecciona todos los enlaces que tienen el atributo class y acaba en icon*/
a[class$="icon"]{...}

/*selecciona todos los enlaces que tienen el atributo class y contiene la palabra icon*/
a[class*="icon"]{...}

/*selecciona todos los elementos que tienen el atributo class y comienza por icon*/
[class^="icon"]{...}

No hay comentarios :

Publicar un comentario