HTML Цитаты и пометки

В данной главе будут рассмотрен следующие HTML элементы добавляющие в веб-документ различные цитаты и пометки: <blockquote>, <q>, <abbr>, <address>, <cite> и <bdo>.

Пример

Вот цитата с другого сайта:

Создание сайта требует определенных знаний. Источником знаний всегда были книги. Однако в определенный момент сюда добавилась еще одна чрезвычайно обширная база данных – сеть Интернет.

HTML элемент <blockquote>

Тег <blockquote> предназначен для оформления цитат в веб-документах.

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

Пример:

<p>Вот подходящая цитата:</p>
<blockquote cite="https://msiter.ru/">
Создание сайта требует определенных знаний. Источником знаний всегда были книги.
Однако в определенный момент сюда добавилась еще одна чрезвычайно обширная база данных – сеть Интернет.
</blockquote>

HTML элемент <q>

Тег <q> позволяет определяить короткую цитату внутри веб-документа.

Браузеры обычно помещают короткие цитаты внутри кавычек.

Пример:

<p>Цель WWF — <q>создать будущее, в котором люди живут в гармонии с природой.</q></p>

HTML элемент <abbr>

Для определения аббревиатуры или акронима (например, «HTML», «CSS») используется тег <abbr>.

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

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

Пример:

<p><abbr title="Организация Объединенных Наций">ООН</abbr> была создана в 1945 году.</p>

HTML элемент <address>

Для того, чтобы определить контактную информацию автора документа, используется тег <address>.

В качестве контактной информации может выступать адрес электронной почты, URL, физический адрес, номер телефона, ссылки на социальные сети и т.д.

Как правило текст внутри тега <address> выводится курсивом, а до и после добавляется разрыв строки.

Пример:

<address>
Автор Петр Парагрофов.<br>
Мы находимся по адресу:<br>
Example.com<br>
Дом 432, Сериалово<br>
РФ
</address>

HTML элемент <cite>

Для определения названия произведения искусства используется HTML-тег <cite>.

Примечание: Имя человека не считается названием.

Текстовое содержимое внутри элемента <cite> обычно выводится курсивом.

Пример:

<p><cite>Мона Лиза</cite> Леонардо да Винчи была написана между 1503 и 1506 годами.</p>

HTML элемент <bdo>

Тег <bdo> используется для изменения направления текста: слева направо (LTR) или справа налево (RTL).

Пример:

<bdo dir="rtl">Этот текст будет отображаться справа налево</bdo>