Tooltip без jQuery/Javascript

Автор: Hous

<a href="#" class="tip">Link<span>Съдържание на текста в tooltip-a</span></a>

Този ред е елементарен линк със клас tip в който има span който не можем да видим докато не поставим курсора върху линка (Link)

За да направим текста да е видим при hover (поставяне на курсора както вече споменах)
ще използваме кратък css код:

<style>
a.tip:hover {
position: relative
}
a.tip span {/*skriwame teksta vyv span tagovete*/
display: none
}
a.tip:hover span {/*pri postavqne na mishkata varhu tekxta , moje da redaktirate po vash vkus*/
border: #ddd 1px solid;
padding: 5px 20px 5px 5px;
display: block;
z-index: 100;
background: #333;
left: 0px;
margin: 10px;
width: 250px;
position: absolute;
top: 10px;
color:#ccc;
}
</style>

Може да видите демо,като копирате 2-та кода и ги поставите в html файл!