¿Puede la segunda de dos hojas de estilo invocadas consecutivamente anular todos los estilos definidos en la primera?

Question

Si tengo una página HTML que enlaza con dos hojas de estilo que se invocan así:

<link rel="stylesheet" href="original.css" media="screen, projection" />
<link rel="stylesheet" href="override.css" media="screen, projection" />

Si estos dos archivos definen exactamente los mismos nombres de estilo, ¿es cierto que original.css no tendrá relación con el resultado de la página de estilo y que todos los estilos vendrán de los estilos definidos en override.css?

La razón por la que pregunto es esta: tengo un <=> que no puedo modificar y no quiero tocar las líneas de código que invocan este archivo. En cambio, me gustaría insertar una llamada a mi nuevo archivo justo después de que se llame al original y anular todo lo definido en el original. No estoy seguro de si esto funcionará, si es aconsejable, etc.

Answer 1

Sí, seguro que puede. Esa es la parte en cascada de las hojas de estilo en cascada.

Sin embargo, debo preguntar, ¿por qué no puedes simplemente eliminar original.css, o no generarlo, o ... algo? Parece un enfoque de Big Hammer para anular completamente todo en original :-) Si realmente genera original.css y override.css, el navegador tendrá que hacer mucho más trabajo que si solo tuviera que generar override.css.

Answer 2

Sí, eso funcionará. Sin embargo, tienes razón en que no es realmente recomendable. En lugar de & Quot; no tocar & Quot; las líneas de código originales, ¿podría insertar etiquetas de comentarios a su alrededor?

Answer 3

Sobreescribirá todo lo que se haya sobrescrito, pero complementará todo no es lo mismo, sino información aplicada diferente a una clase o id o pseudo-selectores o lo que sea. Quiero decir, IE:

original.css -

p { margin: 4px 6px 10px 12px; }
h1 { font-size: 2.2em }

override.css -

p { padding: 6px; color: #666666; }
h1 { font-size: 1.5em }

Lo que dije es que P se complementa en override.css porque los estilos no están en conflicto entre sí. Por otro lado, el ejemplo H1 se sobrescribe y las dos reglas en cada hoja de estilo son contradictorias, por lo que gana la última declaración.

Esto no es tan malo como uno puede pensar ... Acabo de terminar hace un par de meses un sitio en moodle que es un manicomio de estilos y datos combinados y similares. La plantilla utilizó datos de la hoja de estilo de la plantilla PREDETERMINADA, luego de la plantilla PAGE, luego de COURSE. Cuando traté de darme cuenta de qué estilo hacía lo que estaba tan estresado por no encontrar el código correcto para cambiar el mío ... finalmente decidí adjuntar una hoja de estilo propia con los nuevos estilos sobrescritos y los nuevos complementos. eso me hizo ahorrar unas dos semanas buscando en un diseñador de infierno de código nunca soñado.

Espero que esto te ayude a tener una idea más clara.

Adiós.

Answer 4

Un gran ejemplo de esta necesidad es Sharepoint. Editar cualquier tema te dejará con una gran cantidad de cambios que debes anular de la clase core.css.