Sintassi: <br>(a capo) oppure
<hr attributi> (a capo con una linea)
attributi:noshade sfuma la linea
"size" l’altezza in pixel,
"width" larghezza in pixel
ESEMPIO
<br>
<hr noshade size="5" width="50%" >
2
3
•Elenchi ordinati
•Elenchi non ordinati
•Elenchi di definizioni
Sintassi
<elenco>
<elemento>nome del primo elemento
<elemento>nome del secondo elemento
……….
……
</elenco>
4
Elenchi ordinati
Sintassi
Esempio
<ol>
<li>nome del primo elemento
<li>nome del secondo
elemento
……….
<ol>
<li> primo elemento
<li>secondo elemento
<li>terzo elemento
……
</ol>
</ol>
Testo fuori lista
ol= order list
li=list item
5
Elenchi ordinati
Sintassi
Esempio
<ol type=“attributo”>
<li>nome del primo elemento
<li>nome del secondo
</ol>
<ol type=“a”>
<li> primo elemento
<li>secondo elemento
<li>terzo elemento
ol= order list
</ol>
li=list item
Testo fuori lista
Attributo:1=numeri arabi;
a=alfabeto minuscolo;
A=alfabeto maiuscolo;
i=romani minuscoli;
I=romani maiuscoli
6
Elenchi non ordinati
Sintassi
Esempio
<ul>type=“attributo”>
<li>nome del primo elemento
<li>nome del secondo
</ul>
<ul type=“circle”>
<li> primo elemento
<li>secondo elemento
<li>terzo elemento
ul= unorder list
</ul>
li=list item
Testo fuori lista
Attributo:disc=pallino pieno;
circle=pallino vuoto;
square=quadrato pieno;
7
Elenchi di definizioni
Sintassi
<dl>>
<attr>nome del primo elemento
<attr>nome del secondo
</dl>
Esempio
<dl>
<dd>nome del primo elemento
<dd>nome del secondo
</dl>
dl= definition list
Attributo: dt=senza rientro;
dd= con rientro;
8
I link sono "il ponte" che consente di passare da un testo all’altro
Sono formati da:
•la risorsa verso cui il collegamento punta
•contenuto che "nasconde“ il collegamento (non importa se si tratta di
testo, di immagine o di files)
Sintassi: <a href=“risorsa">contenuto</a>
ESEMPIO
<a href=“www.cataniaedintorni.it">notizie su Catania e non solo</a>
Nota bene
Per motivi di sicurezza non è possibile eseguire un file ".exe" direttamente dal
web; l’utente dovrà sempre prima scaricarlo sul proprio PC.
9
Nota bene
E’ opportuno dividere il sito in varie sezioni, in modo da avere tutti i documenti
dello stesso tipo all’interno di un contesto omogeneo.
Per creare collegamenti verso i documenti più reconditi, destreggiandoci tra le
strutture più ramificateesistono due tecniche:
indicare un percorso assoluto
Viene utilizzato per far riferimento ad un percorso certo(se si è già in possesso
di un proprio sito)
http://www.itcdefelice.it/corsi/programmatori/materie.html
indicare un percorso relativo
Viene utilizzato per far riferimento ad un percorso ancora da definire(se non si è
già in possesso di un proprio sito)
10
L’attributo title è molto importante, e serve per descrivere l’elemento a cui
fa riferimento il link.
Sintassi:
<a title=“commento" href=URL" > testo</a>
Nota bene
L’attributo title è molto importante per descrivere l’elemento a cui fa riferimento
il link ed è anche utilissimo per migliorare la propria presenza nei motori di
ricerca, che ne vanno a leggere il contenuto.
11
•Per far riferimento a un file che si trovi all’interno della stessa
directory basta linkare il nome del file
<a href="paginaDaLinkare.html">pagina</a>
•Per far riferimento a un file contenuto in una cartella di livello
inferiore alla posizione corrente, nominare la cartella seguita
dallo "slash", e poi il nome del file.
<a href="prima/interna/interna.html">pagina interna</a>
•Per tornare su di un livello, è sufficiente utilizzare la
notazione
<a href="../../index.html">pagina interna</a>
12
Link interni alla stessa pagina
Ci permettono di scorrere la pagina fra un punto e un altro sfruttando il meccanismo ad
indice
Sono costituiti da due parti:
RISORSA CHE PUNTA
<a href="#primo">Primo paragrafo</a>
RISORSA PUNTATA
<a name="primo"><h3>Primo paragrafo</h3></a>
•
13
Vediamo un esempio
E poi costruimao un esempio di due pagine collegate fra loro e che
sfruttino le ancore.
Inutile provare dunque a inserire un file ".psd" (formato nativo di
Photoshop) all'interno della vostra pagina HTML: con grande
probabilità il browser non caricherà il file (dovete infatti prima
convertire il file in uno dei formati sopra-indicati).
È importante ricordare che il codice HTML fornisce delle
indicazioni al browser su come visualizzare il testo e le immagini
- ed eventualmente i video e i suoni - all'interno della pagina: il
testo (come abbiamo visto) è scritto direttamente nel file HTML,
le immagini invece sono caricate insieme alla pagina.
<img src="logo.gif" alt=” logo”
width="224" height="69" />
Immagini con link
<a href="http://www.sito.it"
target="_blank"> <img src="logo.gif"
border="0" width="224" height="69" /></a>