Come per tenere traccia di stili CSS

September 6

Tenere traccia dei CSS (Cascading Style Sheet) stili rappresenta un problema per i progettisti Web, perché i CSS non è un linguaggio di programmazione. I linguaggi di programmazione utilizzano codice ricorsivo come "loop" e le variabili che contengono valori per il riutilizzo in altre parti del codice. Al contrario, il codice CSS contiene un sacco di ripetizione e richiede di cambiare ogni istanza di un valore piuttosto che cambiare una singola variabile. La scrittura, il codice CSS stretto ben organizzato taglia di nuovo sul vostro lavoro e aiuta ad affrontare questi problemi. Prova a scrivere il codice che è facile da eseguire la scansione con gli occhi e stare lontano da utilizzando stili "in linea".

istruzione

1 Scrivi compatti, selettori efficienti. Invece di usare "tag #id .class {}" Si dovrebbe cercare di usare ".class {}" o "#id {}" il più possibile. Utilizzare "tag .class {}" quando si desidera selezionare tutti i tag di una classe, invece, se si utilizza tale nome della classe in altri tag come bene.

2 Gruppo tue selettori insieme in modi che abbiano un senso logico a voi. Ad esempio, è possibile inserire tutti i selettori in tal senso i caratteri del tuo sito web insieme. Utilizzare i commenti per separare ogni gruppo di selettori:

/

Stili di carattere /

p {

font-family: Arial, sans-serif;

}

h1 {

font-weight: normal;

}

3 Mettere ogni selettore su una riga quando si scrive selettori in un elenco:

h1,

h2,

h3 {

colore blu;

}

4 Tenere tutti "<link>" tag nei file di pagina Web raggruppati insieme. Iniziare collegando il foglio di default o stili principali, e aggiungere i fogli di stile in più in ordine di importanza. I fogli di stile che hanno come target Internet Explorer dovrebbe venire scorso:

<Link rel = "stylesheet" href = "path / to / default.css" type = "text / css" />

<Link rel = "stylesheet" href = "path / to / typography.css" type = "text / css" />

<! - [If IE]> <link rel = "stylesheet" href = "path / to / ie-fixes.css" type = "text / css" /> <! [Endif] ->

Quando si utilizza un framework CSS come Blueprint o 960 Grid System, mettere il suo ripristino e file di rete o di colonna prima. Ripristina stili venire prima di tutto.

5 Limitare l'uso di codice CSS nel "<style>" tag ed evitare gli stili inline, per quanto possibile. Quando si effettua stili tra "<style>" tag di incorporare, questi stili non possono effettuare altre pagine del tuo sito web. Se molte delle vostre pagine usare i CSS tra questi tag, poi, quando si aggiorna il sito Web, è necessario modificare molti file invece di uno o due. Stili scritte all'interno dei tag HTML sono chiamati "gli stili inline" e causano disorganizzazione e conflitti quando li uso eccessivo.

Consigli e avvertenze

  • Usare "importante" nel codice CSS quando non si riesce a capire quale stile si hanno problemi con l'override: "proprietà: valore importante;".
  • Provate a combinare i vostri fogli di stile per il minor numero di file possibile per aumentare la velocità di caricamento delle pagine. Questo impedisce al browser di dover fare molte richieste al server.