Разметка информации на странице включает в себя множество тонкостей и нюансов. Например, можно задавать не только тип элемента, но и передавать дополнительную информацию, которая будет обработана браузером. Наведите курсор на текст ниже:

При наведении мыши на элемент появилось небольшое окно с текстом «Всплывающая подсказка. Здесь можно указать дополнительную информацию». Такое поведение задаётся с помощью атрибутов — специальных конструкций, которые могут влиять на вывод информации на странице. Каждый тег в HTML имеет несколько стандартных атрибутов, которые записываются по шаблону атрибут="значение", где:

• Атрибут — название атрибута. Для появления всплывающей подсказки использовался атрибут title
• Значение — значение атрибута. Оно может быть разным, в зависимости от самого атрибута. В примере, в качестве значения, использовался текст, который должен быть выведен при наведении на элемент

Разметка примера со всплывающей подсказкой:

<p title="Всплывающая подсказка. Здесь можно указать дополнительную информацию">Наведите курсор мыши на эту строку текста. Лучше сделать это с компьютера</p>

Атрибут title можно использовать не только на параграфах, а на любом элементе страницы. Такие атрибуты называются глобальными, так как не зависят от элемента. В противовес им есть атрибуты, которые уникальны для одного или нескольких тегов. Например, атрибут colspan, который указывает на объединение ячеек в таблицах. Его использование вне таблиц не имеет никакого смысла.

Атрибуты могут неявно влиять на вывод информации. Например, при использовании языка стилей CSS, встречается атрибут class, задача которого — отделить похожие элементы друг от друга с помощью значения атрибута. О работе классов вы узнаете из курса по CSS, а сейчас важно знать, что этот атрибут никак не проявляет себя при выводе информации на страницу

<p class="lead">Параграф с классом lead</p>
<p class="mega-paragraph">Параграф с классом mega-paragraph</p>

У одного тега может быть указано сразу несколько атрибутов. Тогда они записываются последовательно, при этом порядок указания не имеет значения:

<p class="text-center" title="Этот элемент имеет несколько атрибутов">Параграф с несколькими атрибутами</p>

В этом уроке мы изучили понятие атрибута и их запись. Изучили работу атрибутов title и class, а также узнали о том, что атрибуты бывают глобальные и уникальные для HTML-элементов. Глобальные атрибуты могут быть использованы для любого тега, тогда как уникальные только для определённых

Создайте параграф с произвольным текстом и всплывающей подсказкой. Добавьте к нему класс hexlet