HTML - тег <ul>
Пример
Неупорядоченный список HTML:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Тег <ul>определяет неупорядоченный (маркированный) список.
Используйте <ul>тег вместе с тегом <li> для создания ненумерованных списков.
Совет: используйте CSS для оформления списков .
Совет: Для нумерованных списков используйте тег <ol> .
Поддержка браузера
| Element | |||||
|---|---|---|---|---|---|
| <ul> | Yes | Yes | Yes | Yes | Yes |
Глобальные атрибуты
Тег <ul>также поддерживает глобальные атрибуты в HTML .
Атрибуты события
Тег <ul>также поддерживает атрибуты событий в HTML .
Дополнительные примеры
Пример
Установите различные типы стилей списка (с помощью 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>
Пример
Расширить и уменьшить высоту строки в списках (с помощью 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>
Пример
Создайте список внутри списка (вложенный список):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Пример
Создайте более сложный вложенный список:
<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>
Связанные страницы
Учебник по HTML: HTML-списки
Справочник по HTML DOM: объект Ul
Учебное пособие по CSS: списки стилей
Настройки CSS по умолчанию
Большинство браузеров будут отображать <ul>элемент со следующими значениями по умолчанию:
Пример
ul {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1 em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}