Посмотреть все уроки курса
Выбрать другой урок из курса
Поиск по сайту
Теория урока

28. Что такое маркированный список в HTML

@codebra_official
Подписывайся на наш Telegram-канал!
Новости, полезный материал,
программирование и ИБ

Ранее изучили нумерованные списки. В этом уроке познакомимся с маркированными списками. Они очень похожи.

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

Чтобы сформировать список, используется тег <ul>, это парный тег и поэтому не забывайте его закрывать.

Каждый элемент, как и нумерованного списка, выделяется при помощи парного тега <li>. Далее пример:

Пример (html)
<ul>
    <li>Пункт</li>
    <li>Пункт</li>
</ul> 

Отступы сверху и снизу добавляются автоматически. Вернемся к оформлению маркированного списка. Есть три аргумента (параметра) у атрибута type (он меняет стиль маркеров):

  • круглые (стандартные) type = "disc";
  • окружность (внутри не закрашенные) type = "circle";
  • квадратные (закрашенный квадрат) type = "square".

Далее рассмотрим пример создания маркированного списка с квадратными маркерами:

Пример (html)
<ul type = "square">
    <li>Пункт</li>
    <li>Пункт</li>
</ul> 

Далее начнёте изучать акцентирование текста с помощью HTML-тегов.

Похожие уроки Codebra

@codebra_official
Подписывайся на наш Telegram-канал!
Новости, полезный материал,
программирование и ИБ
Структура документа: сестринские элементы в CSSСелекторы в CSS
Что такое и как создать ссылки в HTMLСсылки в HTML
Перечисление информации с помощью enum4linux и rpcclientРазведка и сканирование
Что такое изображения в HTMLИзображения в HTML
Поиск хостов с помощью NmapРазведка и сканирование
Курс по Python от CodebraЗнакомство с Python
Первое знакомство с PythonЗнакомство с Python
Кортежи в PythonЗнакомство с Python
Что такое таблица в HTMLТаблицы в HTML
Раздел «Разметка текста в HTML»
22. УРОК: 1. Заголовки и подзаголовки в HTML
23. ПРАКТИКА: 2. Заголовки и подзаголовки в HTML (практика 1)
24. УРОК: 4. Что такое абзац в HTML (тег P)
25. УРОК: 6. Перенос строки (br) и разделительная линия (hr) в HTML
26. ПРАКТИКА: 7. Практикуемся в переносе строки с помощью HTML
27. УРОК: 9. Нумерованный список в HTML
УРОК 28. 11. Что такое маркированный список в HTML
Вы здесь
29. УРОК: 13. Акцентирование (выделение) текста в HTML
30. ПРАКТИКА: 14. Жирно-курсиво-перечеркнутый
31. УРОК: 16. Цитаты в HTML
32. УРОК: 18. Верхний и нижний индексы в HTML
33. УРОК: 20. Универсальные атрибуты в HTML
34. ТЕСТ: 21. Тест по разделу «Разметка текста в HTML»
Другие разделы
Раздел 1. Знакомство с HTML
Раздел 3. Ссылки в HTML
Раздел 4. Изображения в HTML
Раздел 5. Таблицы в HTML
Раздел 6. Формы в HTML
Раздел 7. HTML5
Раздел 8. Остальное
Раздел 9. Знакомство с CSS
Раздел 10. Селекторы в CSS
Раздел 11. Структура и каскад
Раздел 12. Единицы измерения
Раздел 13. Шрифт
Раздел 14. Свойства текста
Раздел 15. Форматирование
Раздел 16. Отступы, рамки, поля
Раздел 17. Цвета и фон
Раздел 18. Позиционирование
Раздел 19. Верстка таблиц
Раздел 20. Списки
Раздел 21. Анимация
Раздел 22. Знакомство с Flexbox
Раздел 23. Практика с htmlbook.ru
Раздел 24. Элементы сайта
Впервые на сайте Codebra?

Извините за это всплывающее окно, меня они тоже раздражают.

Образовательный ресурс codebra.ru полностью посвящен программированию и компьютерной безопасности. Все курсы и уроки находятся на главной странице. Ради интереса можете посмотреть на содержимое курсов по Пентесту Active Directory, Python, HTML и CSS, JavaScript, C++ и другие, размещенные на главной странице.

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

Удачи в обучении!

Закрыть окно