HTML- <ul> -Tag
Beispiel
Eine ungeordnete HTML-Liste:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Das <ul>Tag definiert eine ungeordnete (Aufzählungszeichen) Liste.
Verwenden Sie das <ul>Tag zusammen mit dem <li> -Tag, um ungeordnete Listen zu erstellen.
Tipp: Verwenden Sie CSS, um Listen zu formatieren .
Tipp: Verwenden Sie für geordnete Listen das Tag <ol> .
Browser-Unterstützung
| Element | |||||
|---|---|---|---|---|---|
| <ul> | Yes | Yes | Yes | Yes | Yes |
Globale Attribute
Das <ul>Tag unterstützt auch die globalen Attribute in HTML .
Ereignisattribute
Das <ul>Tag unterstützt auch die Ereignisattribute in HTML .
Mehr Beispiele
Beispiel
Legen Sie die verschiedenen Listenstiltypen fest (mit 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>
Beispiel
Zeilenhöhe in Listen erweitern und reduzieren (mit 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>
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: Ul-Objekt
CSS-Tutorial: Styling-Listen
Standard-CSS-Einstellungen
Die meisten Browser zeigen das <ul>Element mit den folgenden Standardwerten an:
Beispiel
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}