¿Cuál es el uso correcto de la función attr de CSS?

Question

Como esta función se implementa en IE8, quería ver exactamente qué podía hacer con ella, pero tengo problemas para hacer que funcione en cualquier lugar que no sea el: antes y después de los pseudo-elementos css. ¿Debería permitirse lo siguiente?

span[color] { color: attr(color); } 

Lo intenté en Google Chrome también, pero no funcionó. Además, ¿qué pasa con las cosas más dinámicos como:

input[value=attr(default)] { color: gray; } 

Answer 1

En CSS 2.1 (que es lo que se debe utilizar en estos días) la función attr es un poco limitado en lo que puede hacer. El único lugar donde puede aparecer es en una propiedad content en :before and :after pseudo-elements. Por lo tanto, su único propósito se genera contenido.

En CSS 3 este changed a bit, en ese attr() puede devolver otros tipos que no sean solo cadenas y también se puede usar para otras propiedades.

Pero hay que tener en cuenta que la mayor parte de CSS 3 is still a Working Draft con muy pocas características (sin incluir los valores y unidades ) es una Candidata a Recomendación. El soporte de Agentes de usuario para las características de CSS 3 actualmente varía entre limitado y próximo a inexistente. La mayoría de los vendedores de navegadores parecen luchar contra el aburrimiento mediante la implementación de "cosas geniales" como bordes redondeados, sombra de texto, etc., lo que no significa mucho trabajo de apoyo. Pero lo que estabas viendo aquí definitivamente va más allá y el estado de WD no cambiará en el futuro cercano. Así que no esperes que se implemente en ningún lado.

Answer 2

Sólo tiene que utilizar

span.red {} 

para cualquier color diferente, no creo que necesita todas las combinaciones :)

o simplemente utilizar

span[color="red"] {}