HTML <li> -Tag
Beispiel
Eine geordnete (<ol>) und eine ungeordnete (<ul>) HTML-Liste:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Das <li>
Tag definiert ein Listenelement.
Das <li>
Tag wird in geordneten Listen ( <ol> ), ungeordneten Listen ( <ul> ) und in Menülisten ( <menu> ) verwendet.
In <ul> und <menu> werden die Listenelemente normalerweise mit Aufzählungszeichen angezeigt.
In <ol> werden die Listenelemente normalerweise mit Zahlen oder Buchstaben angezeigt.
Tipp: Verwenden Sie CSS, um Listen zu formatieren .
Browser-Unterstützung
Element | |||||
---|---|---|---|---|---|
<li> | Yes | Yes | Yes | Yes | Yes |
Attribute
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 |
Globale Attribute
Das <li>
Tag unterstützt auch die globalen Attribute in HTML .
Ereignisattribute
Das <li>
Tag unterstützt auch die Ereignisattribute in HTML .
Mehr Beispiele
Beispiel
Verwendung des value-Attributs in einer geordneten Liste:
<ol>
<li value="100">Coffee</li>
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
<li>Juice</li>
<li>Beer</li>
</ol>
Beispiel
Legen Sie verschiedene Listenstiltypen fest (mit 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>
Beispiel
Erstellen Sie eine Liste in einer Liste (eine verschachtelte Liste):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Beispiel
Erstellen Sie eine komplexere verschachtelte Liste:
<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>
Verwandte Seiten
HTML-Tutorial: HTML-Listen
HTML-DOM-Referenz: Li-Objekt
CSS-Tutorial: Styling-Listen
Standard-CSS-Einstellungen
Die meisten Browser zeigen das <li>
Element mit den folgenden Standardwerten an:
li {
display: list-item;
}