Terza lezione sul linguaggio HTML.

1. Se abbiamo la necessità di realizzare un elenco possiamo usare
due tipi di TAG i quali determinano:
gli elenchi ordinati
 gli elenchi non ordinati.

2. Gli elenchi ordinati sono contraddistinti dall’enumerazione degli elementi che
compongono la lista ossia una serie progressiva ordinata e individuata da
lettere o numeri.
Il TAG per aprire l’elenco è:
<ol>
(“ordered list”) mentre quello per determinare gli elementi (“list item”) è:
<li>
Esempio:
HTML Effetto
<ol> 1. primo elemento
<li>primo elemento</li> 2. secondo elemento
<li>secondo elemento</li> 3. terzo elemento
<li>terzo elemento</li>
</ol>

3. Lo stile di enumerazione visualizzata di default dal browser è quello numerica,
ma è possibile indicare uno stile differente specificandolo per mezzo
dell’attributo type:
Valori Stile di Numerazione
type = 1 Numeri arabi 1. Primo elemento
(default) 2. Secondo
type = “a” Alfabeto a. Primo elemento
minuscolo b. Secondo elemento
type = “A” Alfabeto A. Primo elemento
maiuscolo B. Secondo elemento
type = “i” Numeri romani i. Primo elemento
minuscolo ii. secondo elemento
type = “I” Numeri romani I. Primo elemento
maiuscolo II. Secondo elemento

4. Il TAG da utilizzare per aprire un elenco non ordinato (elenchi puntati) è:
<ul>
(“unordered list”) e gli elementi sono individuati dal TAG:
<li>
Esempio:
HTML Effetto
<ul> • primo elemento
<li>primo elemento</li> • secondo elemento
<li>secondo elemento</li> • terzo elemento
<li>terzo elemento</li>
</ul>

5. Il tipo di simbolo grafico visualizzato di default dal browser è un “pallino pieno”,
ma è possibile indicare uno stile differente specificandolo per mezzo
dell’attributo type:
Valori Stile di Numerazione
type =“disc” Pallino Pieno • Primo elemento
(default) • Secondo elemento
type = “circle” Cerchio vuoto o Primo elemento
o Secondo elemento
type = “square” Quadrato Pieno  Primo elemento
 Secondo elemento

6. I link sono dei ponti che consentono di passare da un testo all’altro e sono
formati da due componenti:
Contenuto È la parte visibile del link che
nasconde il collegamento sia che si
tratti di
immagine che di testo
Risorsa È l’oggetto verso cui il collegamento
punta che potrebbe essere un’altra
pagina (sullo stesso server o su un
server diverso), oppure un
collegamento interno a un punto
della pagina stessa

7. Il TAG che definisce un link è il seguente:
<a>…</a>
Il TAG che definisce un link deve essere ovviamente dotato dell’attributo che si
riferisce alla risorsa a cui esso è collegato.
L’attributo che gli assegniamo è il seguente:
href=“nomerisorsa”
Dove quindi nomerisorsa indica la destinazione del link.
Esempio:
<a href=“nomerisorsa”>collegamento…</a>
Collegamento… indica la parte di testo che compare sottolineata e di colore
blu per rappresentare un link.
Ovviamente il colore del link può essere cambiato con alcuni attributi.

8. Collegamento ad una pagina interna del sito:
<a href=“prova.html”>Clicca Qui</a>
In questo caso cliccando sul testo Clicca Qui verremo spostati sulla pagina
“prova.html” del nostro sito web.
Collegamento ad una pagina esterna del sito:
<a href=“http://html.it”> Clicca Qui </a>
In questo caso cliccando sul testo Clicca Qui verremo reindirizzati al sito web
“html.it”.

9. Creare due pagine HTML con tutti i TAG che conosci e con i rispettivi nomi:
 “index.html”
 “info.html”
Collega le due pagine con i rispettivi TAG che si chiameranno:
 Home
 Info
Nella “index” parlerai della tua pagina e perché l’hai creata mentre nella info
parlerai di te, del tuo corpo e della tua vita.