La formattazione del testo

H
F-XC A N GE
H
F-XC A N GE
N
bu
y
.c
lezione 2
La formattazione del testo
Per la formattazione del testo HTML mette a disposizione una serie di TAG.
I principali tag sono:
<B>... </B>: testo in grassetto;
<I>... </I>: testo in corsivo;
<U>... </U>: testo sottolineato;
<Q>... </Q>: citazione breve tra apici;
<STRIKE>... </STRIKE>: testo barrato o depennato;
<SUP>... </SUP>: testo apice;
<SUB>... </SUB>: testo pedice.
<CITE>... </CITE>: citazione, il testo viene visualizzato in corsivo
I caratteri: Per definire le proprietà del carattere, dimensioni, colore, tipo di
carattere adoperato per la scrittura del testo, usiamo gli attributi del tag
<FONT>........</FONT>
•
•
•
FACE="nome" dove nome è il tipo di carattere (Comic Sans Serif, Times
new Roman, ecc.)
COLOR="red" oppure COLOR="#rrggbb" per indicare il colore
SIZE=+ o - "numero" dove numero deve essere compreso tra 1e7 che
vengono sommati o sottratti al numero di default che è 3 (dimensione
standard)
Per tracciare una linea orizzontale da usare come divisorio, usiamo il tag
<HR> che significa appunto Horizontal Rules.Anche questo tag prevede diversi
attributi:
•
•
•
•
•
ALIGN="right" o "left" o "center"
COLOR=..... come per gli altri tag
NOSHADE la linea non prevede ombreggiatura
SIZE="numero" indica la dimensione in pixel
WIDTH= "numero" o "n%" indica la lunghezza della riga in pixel o in
misura percentuale rispetto alla pagina
I paragrafi:Per mandare a capo il testo di una pagina web si usano i tag
<BR>, <P> o <DIV>.
Il tag <BR> equivale ad un'interruzione di riga che non spezza il paragrafo.
Infatti, il testo che segue va a capo mantenendo tutte le caratteristiche del
testo precedente e senza che si crei spazio vuoto tra le righe. Il tag <BR> non
richiede un corrispondente tag di chiusura.
Il tag <P> crea invece un'interruzione di paragrafo; il testo successivo va a
capo, lasciando una riga di spazio vuoto, e può essere formattato in maniera
Prof.ssa Patrizia Tarantino
1
to
k
.d o
m
o
o
c u-tr a c k
lic
w
w
w
.d o
Scuola24ore
m
C
lic
k
to
Corso HTML
w
w
w
C
bu
y
N
O
W
!
PD
O
W
!
PD
c u-tr a c k
.c
H
F-XC A N GE
H
F-XC A N GE
N
to
k
lic
diversa rispetto al testo precedente. Il tag <P> può essere usato singolo
oppure con la rispettiva chiusura </P>.Il tag <P> ammette un attributo con
tre possibili valori:
<P ALIGN=left> Allinea il testo al margine sinistro della pagina.
<P ALIGN=right> Allinea il testo al margine destro della pagina.
<P ALIGN=center> Centra il testo rispetto alla pagina. Di default, quindi se
non diversamente specificato, l'allineamento si prevede a sinistra.
Il tag <DIV> che si usa con la chiusura </DIV> serve a creare un blocco di
testo che va a capo e può assumere caratteristiche di formattazione diverse dal
testo precedente senza tuttavia creare spazio vuoto tra il nuovo testo e quello
precedente. Anche il tag <DIV> prevede gli attributi per la formattazione del
testo.
Il tag <BLOCKQUOTE> </BLOCKQUOTE> genera un paragrafo rientrato
verso destra.
I Titoli: Per la formattazione delle intestazioni, si usa il tag <Hn> </Hn>
dove n può assumere i valori 1, 2, 3, 4, 5, 6 ,ed indica la dimensione dei
caratteri in neretto,da una dimensione molto grande (n=1) a una dimensione
piccola (n=6). Qui di seguito vedete la parola Titolo scritta nei diversi formati:
Titolo H1
Titolo H2
Titolo H3
Titolo H4
Titolo H5
Titolo H6
<H1>...</H1> Tutto il testo compreso fra questi due tags, utilizzerà dei
caratteri molto grandi ed evidenziati in grassetto. Lascia una o due righe
bianche sia al di sopra che al di sotto del testo. Viene utilizzato solitamente per
titoli di pagina centrati rispetto allo schermo.
<H2>...</H2> Testo in grassetto di dimensioni leggermente inferiori al caso
precedente, e con una o due righe bianche sopra e sotto il testo.
<H3>...</H3> Viene utilizzato per il testo normale, sia come dimensione che
come aspetto estetico (font) del carattere. Lascia una o due righe bianche
sopra e sotto il testo.
<H4>...</H4> Viene utilizzato per evidenziare in grassetto un testo con
caratteri di dimensioni normali. Lascia inoltre una riga bianca sopra e sotto.
<H5>...</H5> Come il caso precedente, ma senza grassetto e lasciando una
riga bianca al di sopra del testo.
2
.d o
m
w
o
.c
Prof.ssa Patrizia Tarantino
bu
y
o
c u-tr a c k
w
w
.d o
Scuola24ore
m
C
lic
k
to
Corso HTML
w
w
w
C
bu
y
N
O
W
!
PD
O
W
!
PD
c u-tr a c k
.c
H
F-XC A N GE
H
F-XC A N GE
N
to
k
lic
<H6>...</H6> Carattere in grassetto di piccole dimensioni. Lascia una riga
bianca al di sopra del testo
3
.d o
m
w
o
.c
Prof.ssa Patrizia Tarantino
bu
y
o
c u-tr a c k
w
w
.d o
Scuola24ore
m
C
lic
k
to
Corso HTML
w
w
w
C
bu
y
N
O
W
!
PD
O
W
!
PD
c u-tr a c k
.c