Un pequeño truco en CSS que os vamos a explicar es cómo invalidar estilos que se han definido en línea, sustituyéndolos por los que están en el archivo CSS o entre las etiquetas <style type=”text/CSS”></style>.Este truco no funciona en Internet Explorer 6 pero sí en IE7, IE8, FireFox, Safari, y Opera.

Estructura

Código HTML

<div class="block">
	<span style="background: green;font-weight: bold; color: red;">¡Hola mundo!</span>
</div>

Código CSS

Puedes sobreescribir el estilo de la etiqueta span hija usando las líneas CSS siguientes:

.block span[style]{
    font-weight: normal !important;
    color: #000 !important;
    background: yellow !important;
}

De este modo, aunque en el estilo en línea esté definido que el texto sea rojo, con fondo verde y en negrita, se sobreescribirá por el código CSS mostrado, con fondo amarillo, texto negro y fuente normal.

Ejemplo de su funcionamiento

Vía | Sohtanaka

Compartir/Guardar