Il secondo dei due fogli di stile richiamati consecutivamente può prevalere su tutti gli stili definiti nel primo?

Question

Se ho una pagina HTML che si collega a due fogli di stile che vengono invocati in questo modo:

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

Se questi due file definiscono esattamente gli stessi nomi di stile, è vero che original.css non avrà alcun impatto sul risultato della pagina con stile e che tutti gli stili verranno dagli stili definiti in override.css?

Il motivo per cui lo chiedo è questo: ho un <=> che non posso modificare e non voglio toccare le righe di codice che invocano questo file. Vorrei invece inserire una chiamata al mio nuovo file subito dopo che l'originale è stato chiamato e sovrascrivere tutto ciò che è definito nell'originale. Non sono sicuro che funzioni, sia consigliabile, ecc.

Answer 1

Sì, certo che può. Questo è il pezzo a cascata dei fogli di stile a cascata.

Devo chiederti però, perché non puoi semplicemente eliminare original.css, o non produrlo o ... qualcosa? Sembra un approccio molto Big Hammer per sovrascrivere completamente tutto nell'originale :-) Se effettivamente esegui l'output di original.css e override.css, il browser dovrà fare molto più lavoro che se dovessi semplicemente produrre override.css.

Answer 2

Sì, funzionerà. Hai ragione, però, non è davvero consigliabile. Invece di & Quot; non toccare & Quot; le righe di codice originali, potresti inserire dei tag di commento al suo interno?

Answer 3

Sovrascriverà tutto ciò che è sovrascritto ma completerà tutto non è lo stesso ma informazioni applicate diverse a una classe o ID o selettori pseudo o altro. Voglio dire, 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 }

Quello che ho detto è che P è integrato in override.css perché gli stili non sono in conflitto tra loro. D'altra parte, l'esempio H1 viene effettivamente sovrascritto e le due regole in ogni foglio di stile sono in conflitto, quindi vince l'ultima dichiarazione.

Questo non è così male come si può pensare ... Ho appena finito un paio di mesi fa un sito in moodle che è un manicomio di stili e dati che mi hanno dato il via. Il modello utilizzava i dati del foglio di stile dal modello PREDEFINITO, quindi dal modello PAGINA, quindi da CORSO. Quando ho cercato di capire quale stile ha fatto quello che ero così stressato per non aver trovato il codice corretto da modificare per me ... Alla fine ho deciso di allegare un mio foglio di stile con i nuovi stili sovrascritti e quelli nuovi integrati. che mi ha fatto risparmiare circa due settimane scavando in un inferno-di-codice designer mai sognato.

Spero che questo ti aiuti ad avere un'idea più chiara.

Ciao.

Answer 4

Un ottimo esempio di questa esigenza è Sharepoint. La modifica di qualsiasi tema ti lascerà con tutta una serie di modifiche che devi sostituire dalla classe core.css.