Tag HTML <li>
Esempio
Un elenco HTML ordinato (<ol>) e uno non ordinato (<ul>):
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
Il <li>tag definisce una voce di elenco.
Il <li>tag viene utilizzato all'interno di elenchi ordinati( <ol> ), elenchi non ordinati ( <ul> ) e negli elenchi di menu ( <menu> ).
In <ul> e <menu>, gli elementi dell'elenco vengono generalmente visualizzati con punti elenco.
In <ol>, gli elementi dell'elenco vengono generalmente visualizzati con numeri o lettere.
Suggerimento: usa i CSS per applicare uno stile agli elenchi .
Supporto browser
| Element | |||||
|---|---|---|---|---|---|
| <li> | Yes | Yes | Yes | Yes | Yes |
Attributi
| Attribute | Value | Description |
|---|---|---|
| value | number | Only for <ol> lists. Specifies the start value of a list item. The following list items will increment from that number |
Attributi globali
Il <li>tag supporta anche gli attributi globali in HTML .
Attributi dell'evento
Il <li>tag supporta anche gli attributi dell'evento in HTML .
Altri esempi
Esempio
Utilizzo dell'attributo value in un elenco ordinato:
<ol>
<li value="100">Coffee</li>
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
<li>Juice</li>
<li>Beer</li>
</ol>
Esempio
Imposta diversi tipi di stile di elenco (con CSS):
<ol>
<li>Coffee</li>
<li
style="list-style-type:lower-alpha">Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li
style="list-style-type:square">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: Li Object
Esercitazione CSS: Liste di stili
Impostazioni CSS predefinite
La maggior parte dei browser visualizzerà l' <li>elemento con i seguenti valori predefiniti:
li {
display: list-item;
}