2

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%" >

3

4

•Elenchi ordinati

•Elenchi non ordinati

•Elenchi di definizioni

Sintassi

<elenco> <elemento>nome del primo elemento <elemento>nome del secondo elemento ……….

……

</elenco>

5

Elenchi ordinatiSintassi

<ol> <li>nome del primo elemento <li>nome del secondo elemento ……….

……

</ol>

ol= order list

li=list item

Esempio

<ol> <li> primo elemento <li>secondo elemento <li>terzo elemento

</ol>

Testo fuori lista

6

Elenchi ordinatiSintassi

<ol type=“attributo”> <li>nome del primo elemento <li>nome del secondo

</ol>

ol= order list

li=list item

Attributo:1=numeri arabi; a=alfabeto minuscolo; A=alfabeto maiuscolo;

i=romani minuscoli;

I=romani maiuscoli

Esempio

<ol type=“a”> <li> primo elemento <li>secondo elemento <li>terzo elemento

</ol>

Testo fuori lista

7

Elenchi non ordinatiSintassi

<ul>type=“attributo”> <li>nome del primo elemento <li>nome del secondo

</ul>

ul= unorder list

li=list item

Attributo:disc=pallino pieno; circle=pallino vuoto;

square=quadrato pieno;

Esempio

<ul type=“circle”> <li> primo elemento <li>secondo elemento <li>terzo elemento

</ul>

Testo fuori lista

8

Elenchi di definizioniSintassi

<dl>> <attr>nome del primo elemento <attr>nome del secondo

</dl>

dl= definition list

Attributo: dt=senza rientro;

dd= con rientro;

Esempio<dl> <dd>nome del primo elemento <dd>nome del secondo</dl>

9

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.

10

Nota beneE’ 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 assolutoViene 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)

11

Nota beneL’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.

Sintassi:<a title=“commento" href=URL" > testo</a>

L’attributo title è molto importante, e serve per descrivere l’elemento a cui fa riferimento il link.

12

•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>

13

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>

Vediamo un esempioE 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>