Hola
Bueno, estuve revisando la documentación de css porque tras leer el mensaje hoy, decidí probarlo y en efecto me funcionó.
Debo decir que no entendía como dado que las definiciones son claras, el «#» se utiliza para definir el estilo en los elementos con id y el «.» se utiliza para las clases.
Pero revisando cuidadosamente la documentación de
selectores vi a que se debe el hecho de que funcione.
Resulta que los «Selectores de id» tienen preferencia sobre los «Selectores de atributos».
¿qué son los selectores de atributos?
Pues por ejemplo este:
Código:
H1[title] { color: blue; }
ese selector afectaría a:
Código:
<h1 title="título principal de la página">¡ Hola mundo !</h1>
Pero no afectaría a:
Y a estas alturas se preguntarán ¿y que importan estos selectores de atributos en el hilo de este mensaje?...
Pues lo mismo pensaba yo, pero sigamos leyendo...
;)
Resulta que los «selectores de clase» (los que se inician con '.') son considerados un caso especial de los «Selectores de atributos». Bueno, tal vez no es exactamente un caso especial, pero si es una equivalencia con un caso específico de los primeros.
Procedo a citar el primer párrafo del apartado
5.8.3. de la página con las especificaciones de
selectores:
Cita: For style sheets used with HTML, authors may use the dot (.) notation as an alternative to the "~=" notation when matching on the "class" attribute. Thus, for HTML, "DIV.value" and "DIV[class~=value]" have the same meaning. The attribute value must immediately follow the ".".
Bueno, aclarada la duda y algo más aprendido para mi, no se para el resto, pero tras mi metida de pata, veo que no fué tan metida.
Por cierto, espero no haber liado mucho la explicación.
:)
Felicidad