CREARE PAGINE WEB - Colorare e dimensionare i caratteri

Questa lezione non è aggiornata ma è liberamente consultabile.
Se vuoi acedere alle lezioni riguardanti la creazione di pagine web con HTML,
vai al seguente sommario: Creare siti web in HTML e CSS.

… E non solo colorare!.
In questa lezione, vedrai anche come dimensionare i caratteri.

COLORARE I TAG

Analogamente a quello che si è potuto fare con il tag BODY, può essere fatto per altri TAG.
Si può colorare sfondo e testo dei TAG <H?> e <P> in questo modo:

<H1 style="background-color:black;
color:lime">

LA DIVINA COMMEDIA

</H1>

<H2 style="background-color:red; color:black">

PURGATORIO

</H2>

<H3 style="background-color:green; color:yellow">

Canto I

</H3>

<P style="background-color:silver; color:red">

Per correre miglior acque alza le vele<BR>

ormai la navicella del mio ingegno, <BR>

che lascia dietro a sé mar sì crudele;

</P>

Con questo risultato:

LA DIVINA COMMEDIA

PURGATORIO

Canto I

Per correre miglior acque alza le vele
ormai la navicella del mio ingegno,
che lascia dietro a sé mar sì crudele;

DIMENSIONARE I CARATTERI

Usando l'attributo font-size puoi controllare le dimensioni del testo in questo modo:

<P style="background-color:silver;
color:red; font-size:20px">

Per correre miglior acque alza le vele<BR>

ormai la navicella del mio ingegno, <BR>

che lascia dietro a sé mar sì crudele;

</P>

Con questo risultato:

Per correre miglior acque alza le vele
ormai la navicella del mio ingegno,
che lascia dietro a sé mar sì crudele;

Per aumentare o diminuire la grandezza del carattere, dovrai agire sul valore posto a destra dell'attributo font-size.

ESERCIZI

Per esercizio:
Prendendo per esempio il primo codice di questa lezione,
diminuisci i caratteri del tag <H3> inserendo questo codice:

font-size:12px

.
Ingrandisci i caratteri del tag <P> inserendo questo codice:

font-size:30px

.
La soluzione all'esercizio suesposto è la seguente:

<H3 style="background-color:green;
color:yellow; font-size:12px">

Canto I

</H3>

<P style="background-color:silver; color:red;
font-size:30px">

Per correre miglior acque alza le vele<BR>

ormai la navicella del mio ingegno, <BR>

che lascia dietro a sé mar sì crudele;

</P>

Ed il risultato è il seguente:

Canto I

Per correre miglior acque alza le vele
ormai la navicella del mio ingegno,
che lascia dietro a sé mar sì crudele;

Ti potrebbe interessare anche...

Fare calcoli e creare elenchi con
- Come creare un blog gratis
- Come creare siti web gratis
- Gestisci le tue foto con Picasa
- Naviga veloce con Google Chrome
- Scarica video e musica con Free Studio

Frasi celebri

“Se non lo sai spiegare in modo semplice, non l'hai capito abbastanza bene” (Albert Einstein).