Liste

Lista non ordinata

<ul>
  <li>
    Gatto numero uno
  </li>
  <li>
    Gatto numero due
  </li>
  <li>
    Gatto numero tre
  </li>
  <li>
    Gatto numero quattro
  </li>
</ul>

Nota:
<ul> può avere solo <li> come discendenti diretti.

I tag <ul> e <li> sono elementi di tipo block.

Lista ordinata

<ol>
  <li>
    Topo numero uno
  </li>
  <li>
    Topo numero due
  </li>
  <li>
    Topo numero tre
  </li>
  <li>
    Topo numero quattro
  </li>
</ol>

La lista ordinata si contraddistingue per la numerazione degli elementi.
Aggiungendo l’attributo type all’interno del tag <ol> possiamo indicare se le voci in elenco possono iniziare con numeri, lettere o con i numeri romani.

<ol type="1"> numeri interi “arabi” (valore di default, non serve specificarlo)
<ol type="a"> alfabeto minuscolo
<ol type="A"> alfabeto maiuscolo
<ol type="i"> numeri romani minuscoli
<ol type="I"> numeri romani maiuscoli

Inoltre, è possibile gestire la numerazione aggiungendo l’attributo start al tag <ol>, oppure, aggiungendo l’attributo value al tag <li> per gestire la partenza della numerazione da un certo valore.
Vale anche per l’alfabeto.

<ol start="10"> indica il valore iniziale da cui far partire la numerazione della lista, in questo caso partirà dal numero 10
<li value="30"> indica il valore applicato alla numerazione di un certo elemento e modifica la numerazione anche degli elementi successivi nella lista.

I tag <ol> e <li> sono elementi di tipo block.

Lista di definizione

<dl>
    <dt>Cane</dt>
    <dd>Abbaia ma non morde</dd>
    <dt>Gatto</dt>
    <dd>Fa le fusa ma ti graffia</dd>
    <dt>Topo</dt>
    <dd>Vuole solo il formaggio</dd>
</dl>

Le liste di definizione sono un elemento poco utilizzato nelle pagine web.

Il loro scopo è quello di elencare descrittivamente una serie di elementi costituiti da termine e descrizione.

<dl> è il contenitore della lista di definizione
<dt> contiene il termine
<dd> contiene la descrizione

I tag <dl>, <dt> e <dd> sono elementi di tipo block.