Formattazione,
Paragrafi, Elenchi puntati
Titoli
<H1> <H6>
Il tag <Hn> n è il numero da 1 a 6 che è possibile
dare all'elemento ha la funzione di fornire stili ai titoli di
pagina,quindi i numeri vanno da 1 a 6, con maggior importanza
dei numeri più bassi rispetto a quelli alti, il risultato
è che con <H1> si ottiene il titolo più grande
mentre con <H6> il più piccolo.
<FONT>
Il
tag FONT è molto importante ed è simile al tag TEXT(cioè
quello che da un colore univoco a tutto il testo del documento),
ma con funzioni molto più ampie. Il tag FONT può
definire il tipo di font utilizzato, grandezza e colore. Ecco
la sintassi:
<FONT FACE="arial" SIZE=3 COLOR=red>Carattere
da formattare</FONT>
L'attributo
FACE="arial" indica il tipo di carattere da richiamare
per la visualizzazione. SIZE=3 la grandezza del carattere che
può andare da 1 a 7 (i numeri vicini al 7 sono i più
grandi); COLOR=red indica il colore del testo (come sempre esprimibile
anche in valori esadecimali).
<B>,
<I>, <U>
<B>,
<I>, <U> sono tre dei più usati tag di formattazione
fisica dell'HTML. Tutti vanno aperti e successivamente richiusi:
<B>
Testo grassetto </B>
Mettendo del testo in questi tag viene trasformato in grassetto
(la B sta per BOLD).
<I>
Testo corsivo </I>
Mettendo del testo in questi tag viene trasformato in corsivo
(la I sta per ITALIC)
<U>
Testo sottolineato </U>
Mettendo del testo in questi tag esce sottolineato (la U sta per
UNDERLINE).
Esiste
anche il tag STRIKE per il testo barrato:
<STRIKE> Testo barrato </STRIKE>
Creare
paragrafi con <P>
Il
tag <P> definisce un nuovo paragrafo del testo indicando
al browser che lo stesso deve rimanere su una nuova riga ed essere
posizionato a destra, a sinistra o al centro. Se non specificato
oltre, il tag <P> allinea il testo di default sulla sinistra.
Per indicare altri tipi di posizionamento esistono attributi specifici:
<P
ALIGN=left>
Definisce un paragrafo e allinea sulla sinistra (left).
<P
ALIGN=right>
Definisce un paragrafo e allinea sulla destra (right).
<P
ALIGN=center>
Definisce un paragrafo ed allinea al centro (center).
Andare a capo con <BR>
<BR>
è un tag di interruzione di riga cioè torna a capo
lasciando uno spazio vuoto e va usato singolarmente senza tag
di chiusura.
Posizionamento
del testo con <DIV ALIGN> e <CENTER>
L'elemento
<DIV> viene utilizzato per allineare il testo in posizione
orizzontale a sinistra, destra e centro della pagina.
<DIV
ALIGN=left>Testo e immagini a sinistra</DIV>
Sposta tutti gli elementi contenuti tra i suoi tag sulla sinistra.
<DIV
ALIGN=right>Testo e immagini a destra</DIV>
Sposta tutti gli elementi sulla destra.
<DIV
ALIGN=center>Testo e immagini centrate</DIV>
Sposta tutti gli elementi in posizione centrale.
<CENTER>Testo
da centrare</CENTER>
Il tag <CENTER> ha un funzionamento simile a <DIV ALIGN=center>
Linee
orizzontali con <HR>
Le
linee orizzontali sono ottime per dividere parti del documento
e rendere il testo più leggibile. La sintassi è
questa:
<HR
align="CENTER" size="3" width="200"
color="Red" noshade>
Il
tag HR (acronimo che sta per Horizontal Rule) non ha bisogno di
chiusure successive. Si compone di diversi attributi:
aling="CENTER":
stabilisce la posizione della riga (center, right, left).
size="32": stabilisce l'altezza, in pixel, della riga.
width="200": stabilisce la lunghezza orizzontale, in
pixel, della linea. Si può anche indicare in percentuale
width=80%.
color="RED": stabilisce il colore della linea.
noshade:
se presente questo attributo elimina l'effetto 3D della linea.
Se viene omesso produce questo effetto.
Elenchi
numerati
Gli
elenchi numerati servono per organizzare le informazioni che si
trovano all'interno di un sito e un ottimo sistema per rendedere
chiaro e ben leggibbile il documento.
Gli
elenchi numerati si aprono con il tag <OL></OL><>
poi per ogni voce nel menu si mettono altrettanti tag <LI>
Ecco
la corretta sintassi:
<OL>
<LI>Prima
<LI>
Seconda
<LI> Terza
</OL>
Le
ultime versione di HTML danno la possibilità di fare elenchi
ordinati diverso dai numeri come abbiamo visto sopra.
Questo
esempio creare un indice alfabetico in lettere maiuscole:
<OL TYPE=A>
<LI> Prima
<LI> Seconda
<LI> Terza
</OL>/b>
Mentre
quest'altro in lettere minuscole:
<OL TYPE=a>
<LI>Prima
<LI>Seconda
<LI> Terza
</OL>
Questo
esempio crea un indice con numeri romani maiuscoli:
<OL TYPE=I>
<LI> Prima voce di menù
<LI> Seconda voce di menù
<LI> Terza voce di menù
</OL>
Mentre
quest'altro minuscoli:
<OL TYPE=i>
<LI> Prima voce di menù
<LI> Seconda voce di menù
<LI> Terza voce di menù
</OL>
Elenchi
puntati
Gli
elenchi puntati sono simile a gli altri elenchi di indicizzazione
solo che non seguono una struttura gerarchica.
Gli elenchi puntati si aprono con il tag <UL></UL>
poi per ogni voce nel menù si mettono altrettanti tag <LI>.
Ecco
la corretta sintassi:
<UL>
<LI> Prima
<LI> Seconda
<LI> Terza
</UL>
Se non stabilito diversamente l'elenco crea una serie di pallini.
Come per gli elenchi numerati anche in questo caso è possibile
indicare diversi tipi di elenco:
I
pallini pieni si ottengono con disc:
<UL TYPE=disc>
><LI> Prima voce di menù
<LI> Seconda voce di menù
<LI>Terza voce di menù
</UL>
Mentre
l'attributo circle imposta pallini vuoti all'interno:
<UL TYPE=circle>
<LI> Prima
<LI> Seconda
<LI> Terza
</UL>
Mentre
l'attributo square imposta quadratini pieni:
<UL TYPE=square>
<LI> Prima
<LI> Seconda
<LI>Terza
</UL>
|