Подсказка - Tooltip с помощью css

Опубликовано:
Просмотров: 1604
+1
Голосов: 1

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

Итак добавляем в style.css следующий код

a.tooltip:hover {

background : red;

text-decoration : none;

padding:5px;

}

a.tooltip span {

display : none;

padding : 5px;

margin-left : 5px;

width : 155px;

font-family:Georgia;

font-size:1.2em;

color:#000;

font-style:italic;

}

a.tooltip:hover span {

border : 1px solid #ccc;

background : #fff;

display : inline;

position : absolute;

color : #4e4e4e;

}

Теперь чтобы добавить подсказку в нужном месте вставляем примерно такой код

<a class="tooltip" href="#">слово<span>Текст подсказки</span></a>

Комментарии (0)

Нет комментариев. Ваш будет первым!

Голосуем

Самый нужный компонент