Home > Senza categoria > Tooltip con CSS

Tooltip con CSS

30 dicembre 2009 No Comments

Attraverso le proprietà css dei link è possibile visualizzare tooltip statici senza utilizzare funzioni javascript.

Per la pagina all’opera: DEMO

E questo il codice css:


a:hover {background:#ffffff; text-decoration:none;}
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:100px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c; text-align:center;}

Per utilizzare i tooltip il codice html è il seguente:


Per visuzlizzare il tooltip sposta il mouse <a href="#">QUI<span>Ecco il tooltip all'opera!!!</span></a>.

Tags: css

Lascia un Commento

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *

*

È possibile utilizzare questi tag ed attributi XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>