В данном небольшом уроке я хочу поделиться с вами, одним простым способом создании всплывающих подсказок.  Бывают много случаев когда встречаются слова суть которых вам неизвестно. Например, слово  Бэклинк , чтобы понять что оно означает, наведите курсор мыши на «Бэклинк»   всплывающая подсказка даст ему пояснение.

Сейчас в сети существует много способов создания всплывающих подсказок, одни из них, реализованы на JavaScript, другие- связанные со слоями CSS. Возможно они будут выглядеть красивее, но как правило есть проблемы их отображения в разных браузерах.

Мы разберем простой способ добавления всплывающих подсказок, который на всех браузерах будет выглядеть одинаково. Для этого мы будем использовать html-тега ACRONYM— который показывает, что текст, является сокращением. У данного тега, есть полезный атрибут — title — в котором, собственно, и содержится текст подсказки.

Пример:

<acronym title=»это показатели ТИЦ и PR сайта»>Пузомерка </acronym>

В примере все просто вставляем нужно слово между тегами acronym и в title прописываем ему пояснения.

Также можно слова подгонять под стиль вашего сайта , для этого в общей таблице стилей CSS прописываем следующее правило:

acronym {
border-bottom: 1px dashed blue ; /* Подчеркивание текста */
color: #333333; /* Цвет текста */
cursor:help; /* Меняем стандартный курсор */
}

В результате получим следующее Пузомерка.