Список html: Списки | htmlbook.ru

Leave a Comment / Html / By /

Содержание

Списки HTML уроки для начинающих академия

HTML5CSS.ru

ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ

❮ Назад Дальше ❯

Пример списка HTML

Неупорядоченный список:

  • Пункт
  • Пункт
  • Пункт
  • Пункт

Упорядоченный список:

  1. Первый пункт
  2. Второй пункт
  3. Третий пункт
  4. Четвертый пункт

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

Неупорядоченный список начинается с тега <ul>. Каждый элемент списка начинается с тега <li>.

Элементы списка будут помечены маркерами (маленькими черными кружками) по умолчанию:

Пример

<ul>
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ul>

Неупорядоченный HTML-список-Выбор маркера элемента списка

Свойство CSS list-style-type используется для определения стиля маркера элемента списка:

ЗначениеОписание
discЗадание маркера элемента списка (по умолчанию)
circleУстанавливает маркер элемента списка на окружность
squareУстанавливает маркер элемента списка в квадрат
noneЭлементы списка не будут помечены

Пример — Disc

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Пример — Circle

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Пример — Square

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Пример — None

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

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

Упорядоченный список начинается с тега <ol>. Каждый элемент списка начинается с тега <li>.

По умолчанию элементы списка будут помечены цифрами:

Пример

<ol>
  <li>Coffee</li>

  <li>Tea</li>
  <li>Milk</li>
</ol>

Упорядоченный HTML-список-атрибут Type

Атрибут type тега <ol> определяет тип маркера элемента списка:

ТипОписание
type=»1″Элементы списка будут пронумерованы номерами (по умолчанию)
type=»A»Элементы списка будут пронумерованы прописными буквами
type=»a»Элементы списка будут пронумерованы строчными буквами
type=»I»Элементы списка будут пронумерованы прописными римскими номерами
type=»i»Элементы списка будут пронумерованы римскими номерами в нижнем регистре

Номера:

<ol type=»1″>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Прописные буквы:

<ol type=»A»>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Строчные буквы:

<ol type=»a»>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Римские цифры в верхнем регистре:

<ol type=»I»>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Строчные Римские номера:

<ol type=»i»>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Списки HTML-описания

HTML также поддерживает списки описания.

Список описания — это список терминов с описанием каждого термина.

Тег <dl> определяет список описания, тег <dt> определяет термин (имя), и тег <dd> описывает каждый термин:

Пример

<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>

Вложенные списки HTML

Список может быть вложенным (списки внутри списков):

Пример

<ul>
  <li>Coffee</li>

  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>

Note: List items can contain new list, and other HTML elements, like images and links, etc.

Подсчет списка элементов управления

По умолчанию упорядоченный список начнет отсчет с 1. Если вы хотите начать отсчет с заданного числа, вы можете использовать атрибут start:

Пример

<ol start=»50″>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

Горизонтальный список с CSS

HTML-списки могут быть стилизованы различными способами с помощью CSS.

Одним из популярных способов является стиль списка по горизонтали, чтобы создать навигационное меню:

Пример

<!DOCTYPE html>
<html>
<head>
<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333333;
}

li {
    float: left;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 16px;
    text-decoration: none;
}

li a:hover {
    background-color: #111111;

}
</style>
</head>
<body>

<ul>
  <li><a href=»#home»>Home</a></li>
  <li><a href=»#news»>News</a></li>
  <li><a href=»#contact»>Contact</a></li>
  <li><a href=»#about»>About</a></li>
</ul>

</body>
</html>

Совет: Вы можете узнать больше о CSS в нашем учебнике по CSS.

Справка

  • Используйте элемент HTML <ul> для определения неупорядоченного списка
  • Используйте свойство CSS list-style-type для определения маркера элемента списка
  • Используйте элемент HTML <ol> для определения упорядоченного списка
  • Используйте атрибут HTML type для определения типа нумерации
  • Используйте элемент HTML <li> для определения элемента списка
  • Используйте элемент HTML <dl> для определения списка описания
  • Используйте элемент HTML <dt> для определения термина описания
  • Используйте элемент HTML <dd> для описания термина в списке описания
  • Списки могут быть вложенными в списки
  • Элементы списка могут содержать другие элементы HTML
  • Используйте CSS свойство float:left или display:inline для отображения списка по горизонтали

Теги списка HTML

ТегОписание
<ul>Определяет неупорядоченный список
<ol>Определяет упорядоченный список
<li>Определяет элемент списка
<dl>Определяет список описания
<dt>Определяет термин в списке описания
<dd>Описывает термин в списке описания

❮ Назад Дальше ❯

Популярное

html картинка
как вставить картинку в html
цвет текста фона
размер текста html
цвет размер шрифта html
формы html
список html
таблица html
как сделать ссылку в html
html элементы

Copyright 2018-2020 HTML5CSS. ru

Правила и Условия Политика конфиденциальности О нас Контакты

Террористические и экстремистские организации и материалы

Единый федеральный список организаций, в том числе иностранных и международных организаций, признанных в соответствии с законодательством Российской Федерации террористическими

 

  Наименование организации Суд, вынесший решение, дата и номер судебного решения
1 «Высший военный Маджлисуль Шура Объединенных сил моджахедов Кавказа»

Верховный Суд Российской Федерации от 14.02.2003 ГКПИ 03 116

2 «Конгресс народов Ичкерии и Дагестана»
3 «База» («Аль-Каида»)
4 «Асбат аль-Ансар»
5 «Священная война» («Аль-Джихад» или «Египетский исламский джихад»)
6 «Исламская группа» («Аль-Гамаа аль-Исламия»)
7 «Братья-мусульмане» («Аль-Ихван аль-Муслимун»)
8 «Партия исламского освобождения» («Хизб ут-Тахрир аль-Ислами»)
9 «Лашкар-И-Тайба»
10 «Исламская группа» («Джамаат-и-Ислами»)
11 «Движение Талибан»
12 «Исламская партия Туркестана» (бывшее «Исламское движение Узбекистана»)
13 «Общество социальных реформ» («Джамият аль-Ислах аль-Иджтимаи»)
14 «Общество возрождения исламского наследия» («Джамият Ихья ат-Тураз аль-Ислами»)
15 «Дом двух святых» («Аль-Харамейн»)
16 «Джунд аш-Шам» (Войско Великой Сирии) Верховный Суд Российской Федерации от 02. 06.2006 ГКПИ06-531
17 «Исламский джихад – Джамаат моджахедов»
18 «Аль-Каида в странах исламского Магриба» Верховный Суд Российской Федерации от 13.11.2008 ГКПИ08-1956
19 «Имарат Кавказ» («Кавказский Эмират») Верховный Суд Российской Федерации от 08.02.2010 ГКПИ09-1715
20 «Синдикат «Автономная боевая террористическая организация (АБТО)» Московский городской суд от 28.06.2013 3-67/2013
21 «Террористическое сообщество — структурное подразделение организации «Правый сектор» на территории Республики Крым» Московский городской суд от 17.12.2014, вступило в силу 30.12.2014
22 «Исламское государство» (другие названия: «Исламское Государство Ирака и Сирии», «Исламское Государство Ирака и Леванта», «Исламское Государство Ирака и Шама») Верховный Суд Российской Федерации от 29.
12.2014 № АКПИ 14-1424С, вступило в силу 13.02.2015
23 Джебхат ан-Нусра (Фронт победы)(другие названия: «Джабха аль-Нусра ли-Ахль аш-Шам» (Фронт поддержки Великой Сирии)
24 Всероссийское общественное движение «Народное ополчение имени К. Минина и Д. Пожарского» Московский городской суд,от 18.02.2015, № 3-15/2015, вступило в силу 12.08.2015
25

«Аджр от Аллаха Субхану уа Тагьаля SHAM» (Благословение от Аллаха милоственного и милосердного СИРИЯ)

Московский окружной военный Суд Российской Федерации, от 28.12.2015 № 2-69/2015, вступило в силу 05.04.2016

26 Международное религиозное объединение «АУМ Синрике» (AumShinrikyo, AUM, Aleph) Верховный Суд Российской Федерации,
от 20.09.2016 № АКПИ 16-915С,
вступило в силу 25.10.2016
27 «Муджахеды джамаата Ат-Тавхида Валь-Джихад» Московский областной суд, от 28. 04.2017 № 3а-453/17, вступило в силу 02.06.2017
28 «Чистопольский Джамаат» Приволжский окружной военный суд, от 23.03.2017 № 1-2/2017,вступил в силу 31.08.2017
29 «Рохнамо ба суи давлати исломи» («Путеводитель в исламское государство») Московский окружной военный суд, от 22.02.2018 № 2-1/2018, вступил в силу 24.07.2018
30 «Террористическое сообщество «Сеть» Московский окружной военный суд, от 17.01.2019 № 2-132/2018, вступил в силу 14.03.2019
31 «Катиба Таухид валь-Джихад» Московский окружной военный суд, от 05.06.2019 № 2-63/2019, вступил в силу 05.07.2019
32 «Хайят Тахрир аш-Шам» («Организация освобождения Леванта», «Хайят Тахрир аш-Шам», «Хейят Тахрир аш-Шам», «Хейят Тахрир Аш-Шам», «Хайят Тахри аш-Шам», «Тахрир аш-Шам») Верховный Суд Российской Федерации, от 04. 06.2020 № АКПИ20-275С, вступило в силу 20.07.2020
33 «Ахлю Сунна Валь Джамаа» («Красноярский джамаат») Дальневосточный окружной военный суд от 30.09.2019 г. № 1-21/2019, вступил в силу 05.07.2020
34 «National Socialism/White Power» («NS/WP, NS/WP Crew, Sparrows Crew/White Power,  Национал-социализм/Белаясила, власть») Верховный суд Российской Федерации от 21.05.2021 № АКПИ21-343С, вступил в силу 25.06.2021
35 Террористическое сообщество, созданное Мальцевым В.В. из числа участников Межрегионального общественного движения «Артподготовка» 2-й Западный окружной военный суд от 18.06.2020 № 2-7/2020, вступил в силу 07.06.2021
36 Религиозная группа “Джамаат “Красный пахарь” Красноглинский районный суд г. Самары от 16.07.2021 № 2а-1667/2021, вступило в силу 31.08. 2021
37 Международное молодежное движение «Колумбайн» (другое используемое наименование «Скулшутинг») Верховный Суд Российской Федерации, от 02.02.2022 № АКПИ21-1059С, вступило в силу 11.03.2022
38

Хатлонский джамаат

 2-й Западный окружной военный суд от 03.11.2021 № 2-165/2021,
вступило в силу 24.01.2022
39

Мусульманская религиозная группа п. Кушкуль г. Оренбург

 Оренбургский областной суд от 04.03.2022 № 3а-206/2022 (3а-2113/2021), вступило в силу 22.04.2022
40 «Крымско-татарский добровольческий батальон имени Номана Челеджихана» Верховный Суд Российской Федерации, от 01.06.2022 № АКПИ 22-303С, вступило в силу 05.07.2022
41 Украинское военизированное националистическое объединение «Азов» (другие используемые наименования: батальон «Азов», полк «Азов») Верховный Суд Российской Федерации, от 02. 08.2022 № АКПИ22-411С, вступило в силу 10.09.2022
42 Партия исламского возрождения Таджикистана (Республика Таджикистан) Верховный Суд Российской Федерации, от 14.09.2022 № АКПИ22-680С, вступило в силу 18.10.2022
43 Межрегиональное леворадикальное анархистское движение «Народная самооборона» Челябинский областной суд, от 12.09.2022 № 3а-237/2022, вступило в силу 18.10.2022
44 Террористическое сообщество «Дуббайский джамаат» 2-й Западный окружной военный суд, от 12.07.2022 № 2-121/2022, вступил в силу 26.09.2022
45 Террористическое сообщество – «московская ячейка» МТО «ИГ» 2-й Западный окружной военный суд, от 17.05.2022 № 2-41/2022, вступил в силу 21.12.2022
46 Боевое крыло группы (вирда) последователей (мюидов, мурдов) религиозного течения Батал-Хаджи Белхороева (Батал-Хаджи, баталхаджинцев, белхороевцев, тариката шейха овлия (устаза) Батал-Хаджи Белхороева) Южный окружной военный суд, от 28. 11.2022 № 1-215/2022, вступил в силу 16.12.2022
47 Международное движение «Маньяки Культ Убийц» (другие используемые наименования «Маньяки Культ Убийств», «Молодёжь Которая Улыбается», М.К.У.) Верховный Суд Российской Федерации, от 16.01.2023 № АКПИ22-1227С,  вступило в силу 21.02.2023

 

 

Единый федеральный список организаций, в том числе иностранных и международных организаций, признанных судами Российской Федерации террористическими


В соответствии с пунктом 5 статьи 24 Федерального закона «О противодействии терроризму» от 6 марта 2006 г. № 35-ФЗ единый федеральный список организаций, в том числе иностранных и международных организаций, признанных судами Российской Федерации террористическими, ведет федеральный орган исполнительной власти в области обеспечения безопасности

Список организаций опубликован на сайте ФСБ России

 

 

Федеральный список экстремистских материалов

В соответствии с Федеральным законом «О противодействии экстремистской деятельности» федеральный список экстремистских материалов ведет и публикует Минюст России

 

 

 
Перечень общественных объединений и религиозных организаций, иных некоммерческих организаций, в отношении которых судом принято вступившее в законную силу решение о ликвидации или запрете деятельности

В соответствии  с Федеральным законом «О противодействии экстремистской деятельности» перечень общественных объединений и религиозных организаций, иных некоммерческих организаций, в отношении которых судом принято вступившее в законную силу решение о ликвидации или запрете деятельности ведет и публикует Минюст России

 

 

 

Единый реестр доменных имен, указателей страниц сайтов в сети «Интернет» и сетевых адресов, позволяющих идентифицировать сайты в сети «Интернет», содержащие информацию, распространение которой в Российской Федерации запрещено.

В соответствии со ст. 15.1 Федерального закона «Об информации, информационных технологиях и о защите информации» от 27 июня 2006 г. № 149-ФЗ ведение «Единого реестра» осуществляет Роскомнадзор

 

 

 

 

списков HTML · WebPlatform Docs

Резюме

В этой статье представлены три типа списков в HTML и рассмотрены их основные функции.

Введение

Списки используются для группировки взаимосвязанных фрагментов информации, чтобы они были четко связаны друг с другом и их было легко читать. В современной веб-разработке списки являются рабочими элементами, часто используемыми для навигации, а также для общего контента.

Списки хороши со структурной точки зрения, поскольку они помогают создать хорошо структурированный, более доступный и простой в обслуживании документ. Они также полезны, потому что предоставляют специализированные элементы, к которым можно прикрепить стили CSS. Наконец, семантически правильные списки помогают посетителям читать ваш веб-сайт и упрощают обслуживание, когда ваши страницы нуждаются в обновлении.

Три типа списков

В HTML существует три типа списков:

  • неупорядоченный список — используется для группировки набора связанных элементов в произвольном порядке
  • упорядоченный список — используется для группировки набора связанных элементов в определенном порядке
  • список описаний — используется для отображения пар имя/значение, таких как термины и определения

Каждый тип списка имеет определенное назначение и значение на веб-странице.

Ненумерованные списки

Неупорядоченные (маркированные) списки используются, когда набор элементов может быть размещен в любом порядке. Пример списка покупок:

  • молоко
  • хлеб
  • сливочное масло
  • кофейные зерна

Хотя все предметы являются частью одного списка, вы можете расположить их в любом порядке, и список все равно будет иметь смысл:

  • хлеб
  • кофейные зерна
  • молоко
  • сливочное масло

С помощью CSS можно изменить маркер на один из нескольких стилей по умолчанию, использовать собственное изображение или даже отобразить список без маркеров — мы рассмотрим, как это сделать, в статье «Стили списков и ссылок».

Разметка неупорядоченного списка

Ненумерованные списки используют один набор из тегов

    , обернутых вокруг одного или нескольких наборов из тегов
  •  тегов:

     
      
  
    • хлеб
      • 
  
    • кофейные зерна
      • 
  
    • молоко
      • 
  
    • сливочное масло
      •

    Упорядоченные списки

    Упорядоченные (нумерованные) списки используются для отображения списка элементов, которые должны быть в определенном порядке. Примером могут служить инструкции по приготовлению:

    1. Собрать ингредиенты
    2. Смешать ингредиенты
    3. Поместите ингредиенты в форму для запекания
    4. Запекать в духовке 1 час
    5. Вынуть из печи
    6. Дать постоять десять минут
    7. Подавать

    Если бы элементы списка были перемещены в другом порядке, информация потеряла бы смысл:

    1. Собрать ингредиенты
    2. Запекать в духовке 1 час
    3. Подавать
    4. Вынуть из духовки
    5. Поместите ингредиенты в форму для запекания
    6. Дать постоять десять минут
    7. Смешать ингредиенты

    Упорядоченные списки могут отображаться с несколькими вариантами последовательности. По умолчанию в большинстве браузеров используются десятичные числа, но доступны и другие:

    • Буквы
      • Строчные буквы ASCII (a, b, c…)
      • Прописные буквы ascii (A, B, C…).
      • Строчные буквы классического греческого языка: (έ, ή, ί…)
    • Числа
      • Десятичные числа (1, 2, 3…)
      • Десятичные числа с ведущими нулями (01, 02, 03…)
      • Строчные римские цифры (i, ii, iii…)
      • Прописные римские цифры (I, II, III…)
      • Традиционная грузинская нумерация (ан, бан, ган…)
      • Традиционная армянская нумерация (мек, ерку, ерек…)

    Как и в случае с неупорядоченными списками, вы можете использовать CSS для изменения стиля ваших упорядоченных списков. Дополнительную информацию см. в разделе Оформление списков и ссылок.

    Разметка упорядоченного списка

    В упорядоченных списках используется один набор тегов

      , обернутых вокруг одного или нескольких наборов тегов
    1. тегов:

       
        
  
      1. Собрать ингредиенты
        2. 
  
      2. Смешать ингредиенты
        3. 
  
      3. Поместите ингредиенты в форму для запекания. 
        4. 
  
      4. Выпекать в духовке в течение часа.
        5. 
  
      5. Вынуть из духовки.
        6. 
  
      6. Оставить на десять минут.
        7. 
  
      7. Подавать
        8.
      Нумерованные списки начинаются с цифр, отличных от 1

      Обычное требование при использовании упорядоченных списков состоит в том, чтобы они начинались с цифры, отличной от 1 (или i, или I и т. д.). Это делается с помощью атрибута start , который принимает числовое значение (даже если вы используете CSS, чтобы изменить счетчики списка на алфавитные или латинские). Это полезно, если у вас есть один список элементов, но вам нужно разбить список примечанием или другой связанной информацией. Например, мы могли бы сделать это с предыдущим примером:

       <ол>
  
    2. Собрать ингредиенты
      3. 
  
    3. Смешать ингредиенты
      4. 
  
    4. Поместите ингредиенты в форму для запекания.
      5. 


      Прежде чем поместить ингредиенты в форму для запекания, предварительно разогрейте духовку до
180 градусов по Цельсию/350 градусов по Фаренгейту в готовности к следующему шагу. 
      
<старт = "4">
  
    5. Выпекать в духовке в течение часа.
      6. 
  
    6. Вынуть из духовки.
      7. 
  
    7. Оставить на десять минут.
      8. 
  
    8. Подавать
      9.

      Это дает следующий результат:

      1. Собрать ингредиенты
      2. Смешать ингредиенты
      3. Поместите ингредиенты в форму для запекания

      Прежде чем поместить ингредиенты в форму для запекания, разогрейте духовку до 180 градусов по Цельсию/350 градусов по Фаренгейту, чтобы подготовиться к следующему шагу.

      1. Выпекать в духовке 1 час
      2. Вынуть из печи
      3. Дать постоять десять минут
      4. Подавать

      Обратите внимание, что этот атрибут устарел в HTML 4, поэтому он будет препятствовать проверке вашей страницы, если вы используете строгий тип документа HTML4. Если вы хотите использовать такую ​​функциональность на строгой странице HTML4, и она обязательно должна пройти проверку, вы можете сделать это с помощью счетчиков CSS. Однако, к счастью, атрибут start был восстановлен в HTML5.

      Списки описаний

      Списки описаний (ранее называвшиеся списками определений , но переименованные в HTML5) связывают определенные имена и значения в списке. Примерами могут быть элементы в списке ингредиентов и их описания, авторы статей и краткие биографии, или победители конкурса и годы, в которые они выиграли. У вас может быть сколько угодно групп имя-значение, но в каждой паре должно быть хотя бы одно имя и хотя бы одно значение.

      Списки описаний являются гибкими: вы можете связать более одного значения с одним именем или наоборот. Например, термин «кофе» может иметь несколько значений, и вы можете показать их одно за другим:

       кофе
  напиток из обжаренных молотых кофейных зерен
  чашка кофе
  общественное собрание, на котором пьют кофе
  от среднего до темно-коричневого цвета

      Или вы можете связать более одного имени с одним и тем же значением. Это полезно, чтобы показать варианты термина, все из которых имеют одинаковое значение:

       сода
поп
газировка
кола
  сладкий газированный напиток
      Разметка списка описаний

      В списках описаний используется один набор из тегов

      , обернутых вокруг одной или нескольких групп из
      (имя) и
      (значение) тегов. Вы должны соединить по крайней мере один
      хотя бы с одним
      , и
      всегда должен стоять первым в исходном порядке.

      Простой список описания отдельных имен с отдельными значениями будет выглядеть следующим образом:

       
      
  
      Имя
      
  
      Значение
      
  
      Имя
      
  
      Значение
      
  
      Имя
      
  
      Значение

      Это выглядит следующим образом:

       Имя
  Ценить
Имя
  Ценить
Имя
  Ценить

      В следующем примере мы связываем более одного значения с именем и наоборот:

       <дл>
  
      Имя1
      
  
      Значение, применимое к Name1
      
  
      Имя2
      
  
      Имя3
      
  
      Значение, применимое как к Name2, так и к Name3
      
  
      Имя4
      
  
      Одно значение, которое применяется к Name4
      
  
      Другое значение, применимое к Name4

      Этот код будет отображаться следующим образом:

       Name1
  Значение, которое применяется к Name1
Имя2
Имя3
  Значение, которое применяется как к Name2, так и к Name3
Имя4
  Одно значение, которое применяется к Name4
  Другое значение, которое применяется к Name4

      Выбор типа списка

      Пытаясь решить, какой тип списка использовать, задайте себе два простых вопроса:

      1. Определяю ли я термины или связываю другие пары имя/значение?

        • Если да, используйте список описания.
        • Если нет, не используйте список описания.

      2. Важен ли порядок элементов списка?

        • Если да, используйте упорядоченный список.
        • Если нет, используйте неупорядоченный список.

      Преимущества списка HTML

      • Гибкость: если вам нужно изменить порядок элементов списка в упорядоченном списке, вы просто перемещаете элементы списка; когда браузер отображает список, он будет правильно упорядочен.
      • Стиль: Использование списка HTML позволяет правильно оформить список с помощью CSS. Теги элементов списка
      • отличаются от других тегов в вашем документе, поэтому вы можете специально настроить для них правила CSS.
      • Семантика: списки HTML придают содержимому правильную семантическую структуру. Это имеет важные преимущества, например, позволяет программам чтения с экрана сообщать пользователям с нарушениями зрения, что они читают список, а не просто зачитывать запутанный набор текста и чисел.

      Другими словами, не кодирует элементы списка, используя обычные текстовые теги . Использование текста вместо списка делает больше работы для вас и может создать проблемы для читателей вашего документа. Поэтому, если вашему документу нужен список, вы должны использовать правильный формат списка HTML.

      Вложенные списки

      Отдельный элемент списка может содержать другой полный список, называемый вложенным списком . Это полезно для таких вещей, как оглавления, которые содержат подразделы:

       1. Глава первая
    а. Раздел первый
    б. Раздел второй
    в. Раздел третий
2. Глава вторая
3. Глава третья

      Чтобы отразить это в коде, весь вложенный список содержится внутри первого элемента списка. Код выглядит так:

       
        
  
      1. Глава первая
    <ол>
      
      2. Раздел первый
        3. 
      
      3. Раздел второй.
        4. 
      
      4. Раздел третий.
        5. 
    
      
  
  
    9. Глава вторая
      10. 
  
    10. Глава третья 
      11.

      Обратите внимание, что мы использовали CSS-свойство list-style-type: lower-alpha для упорядочивания вложенного списка строчными буквами вместо десятичных чисел.

      Вложенные списки весьма полезны и часто служат основой для навигационных меню, поскольку они являются хорошим способом определения иерархической структуры веб-сайта. Они также очень гибкие, так как упорядоченные или неупорядоченные списки могут быть вложены как в упорядоченные, так и в неупорядоченные элементы списка. Пример вложения неупорядоченных списков в упорядоченный список см. выше в разделе «Выбор типов списков».

      Теоретически вы можете вкладывать списки на любом уровне, который вам нравится, хотя на практике слишком глубокое вложение списков может привести к путанице. Для очень больших списков вам может быть лучше разделить содержимое на несколько списков с заголовками или даже разделить его на отдельные страницы. Хорошее эмпирическое правило: не размещайте списки глубже, чем на три уровня.

      Заключение

      В этой статье вы увидели, как используются различные типы HTML-списков, как они кодируются, и изучили некоторые основные параметры списков. Дополнительные сведения об изменении внешнего вида и поведения списков HTML см. в разделе Стилизация списков и ссылок.

      См. также

      Внешние ресурсы

      • A List Apart: Taming Lists
      • W3C CSS2: определение типа списка

      Вопросы для упражнений

      • Какие существуют три типа списков HTML?
      • Когда вы будете использовать каждый тип списка? Как бы вы выбрали между ними?
      • Как вы вкладываете списки?
      • Почему для оформления списков следует использовать CSS, а не HTML?

      Списки HTML (с примерами)

      В этом уроке вы узнаете о списках в HTML и их различных типах с помощью примеров.

      HTML-списки используются для отображения связанной информации в легко читаемом и кратком виде в виде списков.

      Мы можем использовать три типа списков для представления различных типов данных в HTML:

      1. Ненумерованный список
        • Заказной список
          1. Список описаний

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

            Неупорядоченный список используется для представления данных в списке, для которого порядок элементов не имеет значения.

            В HTML мы используем тег

              для создания ненумерованных списков. Каждый элемент списка должен быть тегом
            • , представляющим элементы списка. Например,

               
                
  
              • Яблоко
                • 
  
              • Оранжевый
                • 
  
              • Манго
                •

              Вывод браузера

              Здесь

            • Apple
              • ,
            • Orange
              •  и
            • Mango
              •  являются элементами списка.

              Дополнительные сведения о неупорядоченных списках см. на странице Неупорядоченные списки HTML .

              Упорядоченный список

                Упорядоченный список используется для представления данных в списке, для которого важен порядок элементов.

                Тег

                  используется для создания упорядоченных списков. Подобно неупорядоченным спискам, каждый элемент в упорядоченном списке должен быть
                1. тег. Например,

                   
                    
  
                  1. Готово
                    2. 
  
                  2. Установить
                    3. 
  
                  3. Перейти
                    4.

                  Вывод браузера

                  Здесь вы можете видеть, что элементы списка представлены числами для представления определенного порядка.

                  Чтобы узнать больше об упорядоченных списках, посетите Нумерованные списки HTML .

                  Список описаний

                  Список описаний HTML используется для представления данных в форме имя-значение. Мы используем Тег

                  для создания списка определений, и каждый элемент списка описаний состоит из двух элементов:

                  • термин/заголовок — представлен тегом
                  • описание термина , представленного тегом

                  Давайте посмотрим на примере,

                   
                  
  
                  HTML
                  
  
                  Язык гипертекстовой разметки
                  
  
                  CSS
                  
  
                  Каскадные таблицы стилей
                  
  
                  JS
                  
  
                  JavaScript

                  Вывод браузера

                  Поскольку список описаний включает определение термина, его также называют списком определений. Чтобы узнать больше о списке описаний, посетите Список описаний HTML .

                  Теги, используемые в списках HTML

                  Тег Пояснение
                  <ол> Определяет упорядоченный список.

                  Добавить комментарий

                  Ваш адрес email не будет опубликован. Обязательные поля помечены *