HTML/CSS/CSS Controls/Tooltips

Материал из Web эксперт
Перейти к: навигация, поиск

CSS Tooltips

   <source lang="html4strict">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>CSS Tooltips</title> <style type="text/css"> body {

 line-height: 1.2;

} a.tooltip {

 position: relative;

} a.tooltip span {

 display: none;

} a.tooltip:hover {

 font-size: 100%;

} a.tooltip:hover span {

 display:block;
 position:absolute;
 top:1em;
 left:2em;
 padding: 0.2em 0.6em;
 border:1px solid #996633;
 background-color:#FFFF66;
 color:#000;

} </style> </head> <body>

<a href="" class="tooltip">this is a test. this is a test. (asaa) </a> .

</body> </html>

</source>