Un interessante ed esaustivo articolo di Semplicemente ci spiega come associare un css ad un documento html.

Preciso e conciso, ecco riportato l’articolo:

Esistono differenti metodi per associare un foglio di stile ad un documento.

Fogli di stile esterni

Un foglio di stile esterno è un file testuale esterno al documento, contenente esclusivamente le regole CSS da applicare.

Esso è associato al documento utilizzando l’elemento HTML link, posto all’interno dell’elemento head:

I file di testo collegati hanno l’estensione .css.

Gli attributi dell’elemento link specificano rispettivamente:

• La relazione che esiste tra il documento indicato dall’attributo href e il documento contenente l’elemento link, in questo caso stylesheet (foglio di stile).
• L’indirizzo del foglio di stile da includere (l’URL assoluto o relativo).
• Il tipo MIME del foglio di stile collegato: text/css.
• L’attributo media consente di indirizzare fogli di stile a dispositivi differenti, nel nostro esempio screen (schermo).

Fogli di stile incorporati

In questo caso le regole sono poste all’interno del documento HTML stesso e, precisamente, come contenuto dell’elemento style, figlio di head:

Fogli di stile in linea

Negli stili in linea le dichiarazioni sono direttamente associate all’elemento che influenzano utilizzando l’attributo style di HTML:

1. 
   

   Titolo di primo livello

La separazione del contenuto dalla presentazione, ottenuta grazie all’utilizzo di CSS e HTML, è vanificata sia dalla presenza di marcatori e attributi presentazionali deprecati – o marcatori strutturali usati in modo improprio – sia dall’utilizzo di stili in linea.

Utilizzando gli stili in linea è “come se” si utilizzassero elementi presentazionali. Gli stili in linea dovrebbero, quindi, essere sempre evitati.

La regola @import

Un foglio di stile esterno può essere importato all’interno di un CSS incorporato utilizzando la regola @import:

Importare un foglio di stile consente di nasconderlo completamente ai browser IE 3 e 4, Netscape 4 per Windows e IE 4.01 e 4.5 per Mac. Approfondimento.

Anche con la regola @import è possibile impostare il dispositivo di destinazione:

Ma IE 7 e le versioni precedenti non supportano i selettori di media nelle regole @import e ignoreranno l’intera regola.