Списки и ссылки | Урок 3

Списки и ссылки | Урок 3

@sellemanhel

В HTML для создания списков используются теги группы lists. К ним относятся:

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

Типы маркеров

Для маркированного списка доступны 3 типа маркеров: discsquare,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>























































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































































Report Page