Всплывающие подсказки на CSS

По клику


любой тег, атрибут data-title, псевдокласс :focus


?

тег "A", псевдокласс :focus


? Подсказка расположена внутри тега ссылки.
При клике по ссылке появляется блок с подсказкой расположенный внутри.


? Блок подсказки расположен непосредственно после ссылки.
При клике по ссылке появляется блок с подсказкой расположенный внутри.


тег "INPUT", псевдокласс :checked


Подсказка созданная с помощью тега 'INPUT'.
При клике по значку появляется блок с подсказкой расположенный внутри.

При наведении


любой тег, атрибут data-title, псевдокласс :hover


?

тег "A", псевдокласс :hover


? Подсказка расположена внутри тега ссылки.
При наведении по ссылку появляется блок с подсказкой расположенный внутри.


? Блок подсказки расположен непосредственно после ссылки.
При наведении на ссылку появляется блок с подсказкой расположенный внутри.


ПОДСКАЗКА Подсказка расположена внутри тега ссылки.
При наведении на ссылку появляется блок с подсказкой расположенный внутри.


ПОДСКАЗКА Подсказка расположена непосредственно после ссылки.
При наведении на ссылку появляется блок с подсказкой расположенный внутри.
Демонстрационный сайт блога