Liste in HTML
Lista non ordinata HTML
Una lista non ordinata inizia con il tag <ul>
. Ogni elemento della lista inizia con il tag <li>
.
Gli elementi della lista saranno contrassegnati da punti (piccoli cerchi neri) per impostazione predefinita:
<ul> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ul>
Lista ordinata HTML
Una lista ordinata inizia con il tag <ol>
. Ogni elemento della lista inizia con il tag <li>
.
Gli elementi della lista saranno contrassegnati con numeri per impostazione predefinita:
<ol> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
L’attributo “type” della Lista Ordinata
L’attributo “type” del tag <ol>
definisce il tipo di marcatore degli elementi della lista:
- type=“1” Gli elementi della lista saranno numerati con numeri (predefinito)
- type=“A” Gli elementi della lista saranno numerati con lettere maiuscole
- type=“a” Gli elementi della lista saranno numerati con lettere minuscole
- type=“I” Gli elementi della lista saranno numerati con numeri romani maiuscoli
- type=“i” Gli elementi della lista saranno numerati con numeri romani minuscoli
Numeri:
<ol type="1"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Lettere maiuscole:
<ol type="A"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Lettere minuscole:
<ol type="a"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Numeri romani maiuscoli:
<ol type="I"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Numeri romani minuscoli:
<ol type="i"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Conteggio della lista
Per impostazione predefinita, una lista ordinata inizia a conteggiare da 1. Se si desidera iniziare il conteggio da un numero specificato, è possibile utilizzare l’attributo “start”:
<ol start="50"> <li>Caffè</li> <li>Tè</li> <li>Latte</li></ol>
Liste annidate
É possibile annidare liste tra di loro, sia <ol>
che <ul>
. Ecco un esempio:
<ol> <li>Caffè</li> <li> Tè <ol> <li>Tè Nero</li> <li>Tè Verde</li> </ol> </li> <li>Latte</li></ol>
Le liste descrittive in HTML
Una lista di descrizione è una lista di termini, con una descrizione di ciascun termine.
Il tag <dl>
definisce la lista di descrizione, il tag <strong>
definisce il termine (nome) e il tag <dd>
descrive ciascun termine:
<dl> <strong>Caffè</strong> <dd>- bevanda calda nera</dd> <strong>Latte</strong> <dd>- bevanda fredda bianca</dd></dl>