XHTML+CSS应用教程——CSS实现小提示框
<style type="text/css">
.info ul,li{list-style-type: none;}
.info li{ float:left; margin-left:30px;}
.info span{display:none; display:block;}
.info {
position:relative;
text-decoration:none;
font-size:12px;
width:250px;
text-align:center;
border:1px solid #ccc;
height:50px;
line-height:25px;
}
.info a { text-decoration:none;}
.info a span { display:none;}
.info a:hover{ position:relative;}
.info a:hover span{
display:block;
position:absolute;
top:30px;
left:60px;
width:130px;
border:1px solid #ff0000;
background:#fff; color:#000;
padding:5px;text-align:left;
}
/*下面的代码暂时在IE内不起作用*/
.info:hover {background:#eee;color:#333;}
</style>
……
<ul class="info">
<li><a href="http://www.cainiao8.com">CSS提示<span>你可以在这里写一些提示</span></a></li>
</ul>
……
