Le liste HTML

Le liste vengono definite dai tag  <ul> e </ul> (lista non ordinata o elenco puntato)  e dai tag   <ol> e </ol> (lista ordinata o elenco numerato). Ogni elemento della lista è racchiuso tra i tag <li> e </li>.

<ul>
    <li>primo elemento</li>
    <li>secondo elemento</li>
</ul>

• primo elemento
• secondo elemento

La struttura di una lista nidificata in più livelli è analoga alla precedente:

<ul>
    <li>primo livello
        <ul>
            <li>primo elemento</li>
            <li>secondo elemento</li>
        </ul>
    </li>
    <li>secondo livello
        <ul>
            <li>primo elemento</li>
            <li>secondo elemento</li>
        </ul>
    </li>
</ul>

• primo livello
  • primo elemento
  • secondo elemento
• secondo livello
  • primo elemento
  • secondo elemento

La lista ordinata:

<ol>
    <li>primo</li>
    <li>secondo</li>
</ol> 

1. primo
2. secondo

La lista di definizione, invece, è compresa tra i tag <dl> e </dl>. Ogni termine della lista è racchiuso tra i tag <dt> e </dt> e la relativa descrizione tra i tag <dd> e </dd>.

<dl>
    <dt>HTML</dt>
        <dd>HyperText Markup Language</dd>
    <dt>CSS</dt>
        <dd>Cascading Style Sheets</dd>
    <dt>JavaScript</dt>
        <dd>Linguaggio di scripting</dd>
    <dt>PHP</dt>
        <dd>Hypertext Preprocessor</dd>
</dl>

HTML

HyperText Markup Language

CSS

Cascading Style Sheets

JavaScript

Linguaggio di scripting

PHP

Hypertext Preprocessor

Utilizzando una lista HTML (non ordinata) e formattandola opportunamente con i fogli di stile (CSS), è possibile creare menu di navigazione.