<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>www.haohtml.com</title>
<style type="text/css">
* {
font-size:12px;
}
.tip{
position:relative;
color:#00c;
text-decoration:none;
}
.tip:hover{
background:none;
color:#000;
}
.tip span {
display: none;
}
.tip:hover span{
display:block;
position:absolute;top:26px;left:10px;
border-bottom:2px solid #eee;
border-right:2px solid #eee;
}
.tip:hover span p {
color:#f60;
text-align:left;
padding:5px;
border:1px solid #ccc;
background:#fff;
}
</style>
</head>
<body>
<a class="tip" href="#">Div+CSS教程<span><p>52CSS.com Div+CSS教程</p></span></a>
<a class="tip" href="#">CSS布局实例<span><p>52CSS.com CSS布局实例</p></span></a>
<a class="tip" href="#">CSS2.0教程<span><p>52CSS.com CSS2.0教程</p></span></a>
<a class="tip" href="#">CSS酷站欣赏<span><p>52CSS.com CSS酷站欣赏</p></span></a>
<a class="tip" href="#">CSS模板下载<span><p>52CSS.com CSS模板下载</p></span></a>
</body>
</html>
Leave a Reply
Using Gravatars in the comments - get your own and be recognized!
XHTML: These are some of the tags you can use: <a href=""> <b> <blockquote> <code> <em> <i> <strike> <strong>
