Concetti Chiave
- Il collegamento tra file HTML e CSS è essenziale per applicare gli stili al documento HTML.
- L'elemento deve essere inserito nella sezione del file HTML per funzionare correttamente.
- Tre attributi sono necessari per l'elemento : href, type (text/css) e rel (stylesheet).
- È possibile utilizzare un URL o un percorso relativo per specificare la posizione del file CSS.
- Il percorso relativo è una pratica comune quando il file CSS è nella stessa directory del file HTML.
Collegamento tra HTML e CSS
Quando HTML e codice CSS sono in file separati, i file devono essere collegati. In caso contrario, il file HTML non sarà in grado di individuare il codice CSS e lo stile non verrà applicato.
È possibile utilizzare l' elemento per collegare insieme file HTML e CSS. L' elemento deve essere posizionato all'interno della testa del file HTML. È un tag che si chiude automaticamente e richiede i seguenti tre attributi:
1. href - come l'elemento di ancoraggio, il valore di questo attributo deve essere l'indirizzo o il percorso del file CSS.
2. type- questo attributo descrive il tipo di documento a cui stai collegando (in questo caso, un file CSS). Il valore di questo attributo deve essere impostato text/css.
3. rel- questo attributo descrive la relazione tra il file HTML e il file CSS. Poiché stai collegando a un foglio di stile, il valore deve essere impostato su stylesheet.
Esempi di collegamento
Quando colleghi insieme un file HTML e un file CSS, l' elemento sarà simile al seguente:
Nota che nell'esempio sopra il percorso del foglio di stile è un URL:
https://www.codecademy.com/stylesheets/style.css
Specificare il percorso del foglio di stile utilizzando un URL è un modo per collegare un foglio di stile.
Se il file CSS è memorizzato nella stessa directory del tuo file HTML, puoi specificare un percorso relativo invece di un URL, in questo modo:
L'utilizzo di un percorso relativo è un modo molto comune di collegare un foglio di stile.
Domande da interrogazione
- Come si collegano i file HTML e CSS?
- Quali attributi sono necessari per l'elemento `<link>`?
- Qual è la differenza tra un percorso URL e un percorso relativo per collegare un foglio di stile?
I file HTML e CSS devono essere collegati utilizzando l'elemento `<link>` all'interno della testa del file HTML, specificando gli attributi `href`, `type` e `rel` per garantire che il file CSS venga individuato e applicato correttamente.
L'elemento `<link>` richiede tre attributi: `href` (il percorso del file CSS), `type` (deve essere impostato su `text/css`) e `rel` (deve essere impostato su `stylesheet`), per definire la relazione tra i file.
Un percorso URL specifica l'indirizzo completo del foglio di stile, mentre un percorso relativo è utilizzato quando il file CSS si trova nella stessa directory del file HTML, rendendo il collegamento più semplice e comune.