Attributo di stile vs ID impostazione e Css esterno

Question

Comprendo il concetto di mantenere tutti gli elementi di presentazione al di fuori del markup e inserirli in un file .css esterno.

Voglio avere un'idea di quali tipi di situazioni giustificheresti l'uso dell'attributo di stile rispetto all'impostazione di ID e Css esterni.

A questo punto, ho usato molto l'attributo di stile, di solito lo uso per specificare elementi di presentazione specifici per quell'elemento e tutto ciò che è per tutti gli elementi che tiro in un file CSS esterno ma vorrei rivalutare la mia posizione e fare la scelta migliore per il futuro.

Answer 1

Usa CSS esterno per definizioni statiche. Usa le ricerche ID elemento e l'attributo di stile per le cose che cambiano in fase di esecuzione o dove hai bisogno di Javascript per impostare le cose perché CSS non è in grado di ciò che desideri.

Un buon esempio di quest'ultimo è stato lo zebra-striping in jQuery prima del diffuso supporto per selettori CSS 3 :

$(document).ready = function() {
    $("table tr:nth-child(even)").addClass("striped");
});

Oggi puoi farlo nel CSS statico, ma una volta, fare in Javascript era l'opzione migliore.

Answer 2

Uso fogli di stile esterni e i motivi sono indicati di seguito:

1. Mantenibilità: è molto più semplice quando tutte le mie presentazioni sono in un unico file.
2. Mantenimento del codice DRY - sì, questo di nuovo. Prima utilizzavo anche l'attributo di stile per impostare la visualizzazione su " blocco " o "nessuno" intercambiabile. Ora uso solo una classe chiamata " nascondi " e usa quella classe se qualcosa deve essere nascosto e rimuovila se qualcosa deve essere mostrato. In questi giorni di applicazioni Ajax in piena regola, mantengo il mio codice libero da ripetere tali cose ed è molto più pulito.
3. Aiuta quando lavori in un progetto di grandi dimensioni: nel mio ultimo posto di lavoro, avevamo una suite di applicazioni che condividevano lo stesso aspetto grafico. Inserendo tutto in un foglio di stile esterno, inclusi gli stili che verranno invocati dopo che si è verificato un determinato evento, ha aiutato il team ad applicare un design dell'interfaccia utente coerente alle app.

Ho provato a pensare alle ragioni dell'utilizzo degli attributi di stile, ma onestamente posso dire di usarlo solo quando sono pigro per aprire il foglio di stile per cambiare qualcosa in fretta (non troppo orgoglioso di questa parte, quindi cerco di minimizzare esso)

Answer 3

Uno dei grandi vantaggi nello spostare tutti i tuoi stili in un foglio di stile è la manutenibilità. Trovare stili in linea può essere una seccatura per altre persone che cercano di mantenere il tuo codice.

Solo per questo motivo vale la pena assegnare un elemento specifico a un ID e definirne gli stili nel foglio di stile.

In secondo luogo, se ti ritrovi a scrivere molti stili incorporati, probabilmente potresti prendere in considerazione più di quegli stili usando le proprietà di eredità CSS o alcune classi ben fatturate oltre all'ID.

Dal punto di vista delle prestazioni, la selezione degli ID è più rapida di quella dei CSS, quindi l'utilizzo di molte classi è in realtà più lento del drill down con gli ID, anche se solo per microsecondi.

L'unico momento in cui trovo appropriato usare gli stili in linea è per proprietà molto transitorie come l'animazione che usa javascript o si nasconde e mostra un elemento (anche se ciò può essere fatto anche con le classi).