Znacznik HTML <ul>
Przykład
Nieuporządkowana lista HTML:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Znacznik <ul>definiuje nieuporządkowaną (punktowaną) listę.
Użyj <ul>tagu razem z tagiem <li> , aby utworzyć nieuporządkowane listy.
Wskazówka: użyj CSS do stylizacji list .
Wskazówka: w przypadku list uporządkowanych użyj znacznika <ol> .
Obsługa przeglądarki
| Element | |||||
|---|---|---|---|---|---|
| <ul> | Yes | Yes | Yes | Yes | Yes |
Atrybuty globalne
Znacznik <ul>obsługuje również atrybuty globalne w HTML .
Atrybuty wydarzenia
Tag <ul>obsługuje również Atrybuty Zdarzeń w HTML .
Więcej przykładów
Przykład
Ustaw różne typy stylów list (z 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>
Przykład
Rozszerz i zmniejsz wysokość linii na listach (z 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>
Przykład
Utwórz listę wewnątrz listy (lista zagnieżdżona):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Przykład
Utwórz bardziej złożoną listę zagnieżdżoną:
<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>
Powiązane strony
Samouczek HTML: Listy HTML
Odniesienie HTML DOM: Ul Object
Samouczek CSS: Listy stylów
Domyślne ustawienia CSS
Większość przeglądarek wyświetla <ul>element z następującymi wartościami domyślnymi:
Przykład
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}