css - mdn - ¿Cuándo la etiqueta "a" no heredará el atributo de color de la etiqueta principal?

heritage css

Question

Aquí está mi código: parte de css

.blue {
    color:#6E99E1;
    font-size:9px;
}

parte de marcado

<span class="blue">::<a href="/equipment_new.php">CLICK HERE</a>:: to view our New Equipment inventory. <br /><br /></span>

De alguna manera he activado algo que impedía que la etiqueta "a" heredara el color de la etiqueta principal (aquí "span") ahora.

Answer 1

Además de Firebug (que debería ser su primer puerto de escala), la barra de herramientas del desarrollador de IE también le dirá de dónde proviene un estilo dado, en caso de que IE - shock, horror - sea diferente.

Answer 2

Creo que a no hereda color por defecto. (ciertamente siempre ha funcionado de esa manera en mis sitios). Por qué no cambiar

.blue {
    color:#6E99E1;
    font-size:9px;
}

a

.blue, .blue a{
    color:#6E99E1;
    font-size:9px;
}

Answer 3

Debe establecer explícitamente el color de los enlaces para anular el color azul predeterminado.

Answer 4

Iba a publicar esto como un comentario, pero se estaba volviendo un poco largo ... Así que esta es una respuesta a la pregunta, así como una respuesta a la respuesta de Kevin y sus comentarios.

Las etiquetas de ancla heredan el color, vinculadas o no. La única razón por la que no lo hacen es porque ya tienen su color establecido en la hoja de estilo predeterminada del navegador. Lo mismo puede decirse del subrayado del enlace (que, supongo, no notó, porque realmente lo quiere o ya lo ha cambiado).

En Firefox, puedes ver esto en Firebug si cambias "Mostrar CSS de agente de usuario" (o puedes echar un vistazo directamente a las hojas de estilo internas de Firefox . Puedes ver los valores predeterminados del navegador en Webkit Web Inspector y Opera''s Dragonfly también). Creo que puedes en IE.

No conozco ningún sitio que tenga una visión general de todos los valores predeterminados del navegador. La hoja de estilo HTML4 "informativa" de CSS2 así como la hoja de estilo de reinicio de YUI serían un buen punto de partida, pero ninguno de ellos menciona ningún color (enlace) (la hoja de estilo HTML4 menciona el subrayado).

Para saber qué propiedades se heredan en general, puede usar la tabla de índice de propiedades de referencia CSS2 (consulte la columna "¿Heredado?"). SitePoint también lo menciona en su referencia de CSS .

Por lo tanto, si desea asegurarse de que su enlace hereda el color de su elemento primario en lugar de hacerlo desde la hoja de estilo predeterminada del navegador, lo ideal sería hacer algo como esto:

.blue a:link {
    color: inherit;
}

Puede configurarlo para las diferentes pseudo-clases por separado (así :visited :hover y :active también), o para la etiqueta a por completo.

Sin embargo, IE6 e IE7 no son compatibles con la palabra clave inherit , por lo que si desea admitirlos también, deberá establecer el color explícitamente.

Answer 5

Por defecto, una etiqueta de anclaje no hereda atributos como el color si está presente un atributo href.

Mira la diferencia entre estos dos en una página (no sé cómo mostrarla en la publicación):

<span style=color:green><a href="t">test</a></span>


<span style=color:green><a>test</a></span>

El siguiente enlace es para w3 c:

http://www.w3.org/TR/html401/struct/links.html#h-12.2

Los agentes de usuario generalmente hacen enlaces de tal manera que sean obvios para los usuarios (subrayado, video inverso, etc.). La representación exacta depende del agente de usuario. La representación puede variar según si el usuario ya ha visitado el enlace o no.

.....

Por lo general, los contenidos de A no se representan de ninguna manera especial cuando A solo define un delimitador.

Answer 6

Probablemente estés viendo el colorante a: visitado. Prueba esto:

.blue, .blue:link, .blue:visited {
  color:#6E99E1;
  font-size:9px;
}

Answer 7

Solo una adición a las otras respuestas, si quiere que sus etiquetas <a> hereden el color de sus padres, puede usar

a {color: inherit; }

Answer 8

Firebug le mostrará exactamente qué reglas de estilo se aplican a qué elementos. Es perfecto para esto

(Una posibilidad sin CSS: ¿tiene atributos link/alink/vlink en su etiqueta <body> ?)

Edit : Duh, tonto, los demás lo tienen bien - <a href> no hereda el color. Pero Firebug sigue siendo una buena herramienta para este tipo de problema (incluso si no lo estoy) 8-)