Ogni pagina web deve avere uno stile, che non può essere creato semplicemente con HTML. Per questo si utilizza un altro linguaggio, CSS. In questa lezione vedremo come dare uno stile ad una pagina web e come collegare un file CSS ad HTML.
Il tag dello stile CSS
Esiste un tag, <style>, in cui è possibile dare lo stile agli elementi contenuti nell’HTML, in linguaggio CSS. Deve essere inserito in <head>. Per esempio, vogliamo colorare di verde la scritta “Ciao a tutti” contenuto in <span>. Utilizziamo l’id di questo tag, preceduto dal #.
<!DOCTYPE html>
<html>
<head>
<style>
#esempio{
color:green;
}
</style>
</head>
<body>
<p>Puoi colorare la scritta <span id="esempio">Ciao a tutti</span></p>
</body>
</html>
Puoi imparare il linguaggio CSS su Biadets.
Collegare un file CSS esterno
Puoi collegare un file CSS esterno al file HTML con il tag <link>, all’interno di <head>.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="stile.css">
</head>
<body>
<p>Collegare un file CSS.</p>
</body>
</html>
Puoi imparare cosa sono i file di stile e il linguaggio CSS su Biadets.
Lo stile nei tag
Come avrai visto in alcune lezioni precedenti, puoi inserire lo stile direttamente nei tag con l’attributo style="valore".
<p style="color:green">Una scritta verde.</p>
Consigliamo di separare sempre lo stile dai tag. All’inizio puoi utilizzare style per provare più facilmente.
| Prossima lezione |