Урок HTML №12 - теги <dl>, <dt> и <dd> списки определений

В данном уроке HTML я расскажу вам о так называемых списках определений, которые являются отдельным видом списков, при вёрстке кода сайта. Списки определений имеют тег <dl>, <dt> и <dd>. Если сравнивать списки определений с другими списками таким как <ul> или <ol>, которые были описаны в предыдущих моих уроках html, то первые всегда состоят из двух частей. Теги списка определений из трёх. В первой части элемента списка записывается определяемый термин, а во второй части - текст в форме словарной статьи, раскрывающий значение этого термина и всё это помещается в один контейнер <dl>.....</dl>.

Для начала давайте разберём эти теги и узнаем их значение и синтаксис.

• <dl> - Definition List, основной тег контейнер,
• <dt> - Definition Term, в данном теге размещается определяемый термин,
• <dd> - Definition Description, в этом теге размещается абзац с определением термина, расположенного в выше размещённом теге <dt>.

Примечание: для тегов <dt> и <dd> закрывающие теги не обязательны.

Синтаксис данного списка определений таков:

Визуальный результат:

Редактор текста Notepad ++ выбор всех вебмастеров и дизайнеров.

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

Текстовый редактор Notepad++ например имеет такие опции как:

• Мастер создания индивидуальной подсветки синтаксиса
• Создание личного API файла для подстановки набираемого текста
• режим печати WYSIWYG, при применении при печати которого, есть возможность сохранить вид подсветки кода
• поддержка множества плагинов, которые еще дополнительно расширяют возможности редактора
• кодировка из одной системы в другую, в том числе UTF-8 без BOM
• просмотр открытого документа в шестнадцатеричном виде
• файловый менеджер

И кроме всего этого текстовый редактор Notepad ++ имеет большое количество дополнительных возможностей, которые описывать считаю нет смысла, гораздо проще его скачать, установить на ваш компьютер и ознакомиться воочию, так как я на 100% уверен, если вы вебмастер или дизайнер, то лучьше текстового редактора чем Notepar++ вам не найти.

Обновление до актуальной версии у программы идёт автоматически через интернет с официального сайта, так что достаточно скачать один раз и забыть о поиске новой актуальной версии навсегда. Программа бесплатна и не имеет ограничений.

Скачать текстовый редактор Notepad++ вы можете в полной версии данной статьи...

Урок html №11 - теги нумерации ol

При вёрстке для того что бы какой то отдельный абзац текста пронумеровать, применяют теги <ol>. Синтаксис данного тега таков:

Тег <ol> устанавливает контейнер нумерованного списка. Внутри этого тега содержится всегда тег <li>, который в свою очередь содержит видимое содержимое текста. Если к тегу <ol> применяется таблица стилей, то весь контейнер этого тега в котором находятся элементы <li> наследуют все эти свойства.

Данный тег так же как и маркированный тег <ul> поддерживает многоуровневость, по примеру:

Урок HTML №10 - теги ul и li

При вёрстке html кода сайта часто бывает необходимо создать список чего либо в виде помеченных абзацев или как их принято называть маркеров. Такой список с виду как и обычный текст, но имеет постоянный отступ слева (часто и сверху и снизу тоже) всего абзаца. Маркеры имеют свой персональный и отличный вид, а именно обозначение каждого пункта списка всего этого контейнера (абзаца) точкой или др. стилевыми атрибутами. Для этой цели и используют теги <ul> и <li>. Такой маркированный списокначинается с тега <ul> и заканчивается закрывающим тегом </ul>, оба эти тега давайте назовём контейнером, внутри которого обязательно должны быть теги-маркеры <li></li>, в которых содержится содержимое текста.

Синтаксис тегов маркера таков:

<ul></ul> - определяют контейнер маркированного HTML списка

<li></li> - определяют элементы (пункты) маркированного HTML списка.

Если к тегу <ul> применяется таблица стилей CSS, то элементы <li> наследуют эти свойства.

Как видим из первого примера применения данного тега, вид точек элементов <li> по умолчанию имеют вид форму круглой чёрной точки, но с помощью атрибута type и его свойств, таких как:

disc - кружок

circle - окружность

square - квадрат

маркированному списку можно задать другой внешний вид, например: