Тег неупорядоченного списка HTML - httpdoc.ru

HTML-неупорядоченный список

HTML unordered list - это набор связанных элементов, которые перечислены без особого порядка или последовательности. Этот список создается с помощью <ul> тега HTML . Каждый элемент в списке отмечен маркером. Каждый элемент начинается с <li> тега.

Посмотрите на пример ниже, чтобы понять, как использовать HTML-неупорядоченный список:

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Unordered List </title> 
</head>

<body>

<h2> Unordered List </h2>
<ul>
  <li> Harley-Davidson </li>
  <li> Ducati </li>
  <li> BMW </li>
</ul>  

</body>
</html>

Выход

HTML Unordered Lists Example
  • Харли-Девидсон
  • Ducati
  • BMW

Атрибут типа списка разупорядочения

type Атрибут используется для изменения типа серии.

Ценить Описание
type = "диск" Устанавливает маркер элемента списка в виде маркера (по умолчанию).
type = "circle" Устанавливает маркер элемента списка в кружок.
type = "квадрат" Устанавливает маркер элемента списка в квадрат.
type = "none" Пункты списка не будут отмечены.

Атрибут диска

Тип 'Disc' as - <ul type="disc"> . Эти элементы списка будут отмечены маленькими черными кружками в виде маркеров. Это тип по умолчанию в списках разупорядочения.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Unordered List Disc Attribute </title> 
</head>

<body>

<h2> Unordered List </h2>
<ul type="disc"> 
  <li> Harley-Davidson </li>
  <li> Ducati</li >
  <li> BMW </li>
</ul>  

</body>
</html>

Выход

HTML Unordered List Disc Attribute Example
  • Харли-Девидсон
  • Ducati
  • BMW

Атрибут круга

Тип 'Circle' as - <ul type="circle"> . Перед элементами списка будут отображаться круглые полые кружки, похожие на маркеры.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Unordered List Circle Attribute </title> 
</head>

<body>

<h2> Unordered List </h2>
<ul type="circle">
  <li> Harley-Davidson </li>
  <li> Ducati </li>
  <li> BMW </li>
</ul>  

</body>
</html>

Выход

HTML Unordered List Circle Attribute Example
  • Харли-Девидсон
  • Ducati
  • BMW

Квадратный атрибут

Тип 'square' as - <ul type="square"> . Перед элементами списка будут отображаться закрашенные квадраты.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Unordered List Square Attribute </title> 
</head>

<body>

<h2> Unordered List </h2>
<ul type="square">
  <li> Harley-Davidson </li>
  <li> Ducati </li>
  <li> BMW </li>
</ul>  

</body>
</html>

Выход

HTML Unordered List Square Attribute Example
  • Харли-Девидсон
  • Ducati
  • BMW

Атрибут none

Тип 'none' as - <ul type="none"> . Этот атрибут будет перечислять элементы списка, но не ставит перед ними маркеры.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Unordered List None Attribute </title> 
</head>

<body>

<h2> Unordered List </h2>
<ul type="none">
  <li> Harley-Davidson </li>
  <li> Ducati </li>
  <li> BMW </li>
</ul>  

</body>
</html>

Выход

HTML Unordered List None Attribute Example
  • Харли-Девидсон
  • Ducati
  • BMW

Поддержка браузера

Элемент
Microsoft Edge browser.png Край
Chrome browser.png Хром
Firefox browser.png Fire Fox
Opera browser.png Опера
safari browser.png Сафари
<ul>
да
да
да
да
да