Tag HTML <ul>
Esempio
Un elenco HTML non ordinato:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
Il <ul>
tag definisce un elenco non ordinato (puntato).
Usa il <ul>
tag insieme al tag <li> per creare elenchi non ordinati.
Suggerimento: usa i CSS per applicare uno stile agli elenchi .
Suggerimento: per gli elenchi ordinati, utilizza il tag <ol> .
Supporto browser
Element | |||||
---|---|---|---|---|---|
<ul> | Yes | Yes | Yes | Yes | Yes |
Attributi globali
Il <ul>
tag supporta anche gli attributi globali in HTML .
Attributi dell'evento
Il <ul>
tag supporta anche gli attributi dell'evento in HTML .
Altri esempi
Esempio
Imposta i diversi tipi di stile di elenco (con CSS):
<ul style="list-style-type:circle">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul style="list-style-type:disc">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul style="list-style-type:square">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Esempio
Espandi e riduci l'altezza della riga negli elenchi (con CSS):
<ul style="line-height:180%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul
style="line-height:80%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Esempio
Crea un elenco all'interno di un elenco (un elenco annidato):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Esempio
Crea un elenco nidificato più complesso:
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>
Pagine correlate
Esercitazione HTML: Elenchi HTML
Riferimento HTML DOM: Ul Object
Esercitazione CSS: Liste di stili
Impostazioni CSS predefinite
La maggior parte dei browser visualizzerà l' <ul>
elemento con i seguenti valori predefiniti:
Esempio
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}