Списки и ссылки | Урок 3
@sellemanhelВ HTML для создания списков используются теги группы lists. К ним относятся:
- <ul> - тег маркированного списка
- <ol> - тег нумерованного списка
- <li> - тег элемента списка
- <dl> - тег списка определений
- <dt> - тег термина в списке определений
- <dd> - тег описания термина в списке определений
Типы маркеров
Для маркированного списка доступны 3 типа маркеров: disc, square,circle.
Задать тип маркера можно при помощи CSS свойства list-style-type.
Тип маркера может быть задан, как для списка в целом <ul>, так и для конкретного элемента <li>
Положение маркера в списке
HTML поддерживает 2 типа положений маркеров списка: внутри или снаружи. Положение маркера регулируется CSS свойством list-style-position.
Пример:
Сделать свой маркер в HTML списке
Использовать можно свою картинку.
Для этого используйте CSS свойство list-style-image.
Нумерованный список
Чтобы создать нумерованный список используйте теги <ol> и <li>. Тег ol - это контейнер нумерованного списка.
Нумерации в HTML списке
Для этого есть атрибут type.
Разные типы нумерации в списках:
Другие варианты нумерации, включая греческую, еврейскую, японскую, с ведущими нулями и т.д. можно получить используя CSS свойство list-style-type.
Список определений
Для создания списка определений используются теги <dl>, <dt> и <dd>. Тег dl - это контейнер списка определений, dt - термин, dd - описание термина.
Пример простого списка определений:
Ссылки
Ссылки создаются с помощью очень короткого тега <a> (сокращение от «anchor»). Например, вот так:
<a href="https://htmlacademy.ru">HTML Academy</a>
Адрес ссылки задаётся в формате URL с помощью атрибута href
(сокращение от «hyper reference»)
При наличии атрибута download браузер не переходит по ссылке, а предложит скачать документ, указанный в адресе ссылки.
<a download>Ссылка</a>
Позвонить на телефон
<a href="tel:+1234567890"> Звоните нам бесплатно! </ a>