para paginas lista etiquetas estilos ejemplos codigos css

paginas - lista de codigos css



La propiedad de decoraciĆ³n de texto CSS no puede ser anulada por un elemento hijo (2)

Posible duplicado:
¿Cómo consigo que esta anulación de decoración de texto CSS funcione?

Echa un vistazo a este ejemplo simple:

<a href="#"> A <span>red</span> anchor </a>

a { color:blue; font-family:Times New Roman; text-decoration:underline; } span { color:red; font-family:Arial; text-decoration:none; }

Demostración en vivo: http://jsfiddle.net/5t9sV/

Como puede ver en la demostración en JSfiddle, el elemento SPAN anula los valores de propiedad de font-family y color de su elemento ANCHOR ancestro. Sin embargo, la propiedad de text-decoration no se anula por alguna razón.

Supongo que algunas propiedades CSS pueden ser anuladas por elementos de antepasados, y otras propiedades CSS no pueden.

¿Es eso así? Y si es así, ¿cómo puedo saber cuáles pueden y no pueden ser anuladas?


De la especificación de text-decoration :

La propiedad ''texto-decoración'' en elementos descendientes no puede tener ningún efecto en la decoración del antepasado.

La respuesta en la pregunta vinculada contiene más citas (no obstante, no puedo encontrar este texto en la especificación):

Las decoraciones de texto en cuadros en línea se dibujan en todo el elemento, y atraviesan los elementos descendientes sin prestar atención a su presencia.

Y otra cita, CSS3 parece introducir text-decoration-skip , destinado a solucionar esto mediante la aplicación de la propiedad en el descendiente (en su caso, <span> ):

Esta propiedad especifica qué partes del contenido del elemento debe omitirse cualquier decoración de texto que afecte al elemento. Controla todas las líneas de decoración de texto dibujadas por el elemento y también cualquier línea de decoración de texto dibujada por sus antepasados.


Según lo sugerido por Pekka, aquí está mi respuesta:

La decoración del texto se cambia cuando se establece el valor de la decoración del texto. El problema es que, dado que el elemento padre (el ancla) rodea el intervalo, parece que el intervalo se está subrayando.

Esto se hace obvio si establece la decoración de texto del intervalo en verdadero, porque hace que el subrayado sea azul para JUSTO el intervalo.