Criando Tooltips com Css
Postado por @diasbassnov 13
Esse é meu primeiro artigo técnico sobre xhtml e css, por isso irei demonstrar algo de nÃvel bem básico para vocês.
Mas o que são Tooltips?
Tooltips são aquelas informações que aparecem ao colocar o mouse sobre algum link ou imagem. Só não confunda com Title ou Alt. Vamos lá
No HTML:
<p>Utilizando <a href="#">Tooltips<span>Exemplo de Tooltip</span></a></p>
No Css:
<style type="text/css">
a:hover {background:#ffffff; text-decoration:none;} /* background-color e necessario para o IE6 */
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}
</style>
Um exemplo do uso você pode ver aqui: Utilizando Tooltips
Até a próxima! ^^

No comments