<style type="text/css">
ul,li{
margin:0;
padding:0;
float:left;
display:block;
list-style-type: none;
}
.bi{
position: relative;
z-index: 0;
}
.bi:hover{z-index: 99;}
.bi:hover span{
visibility: visible;
top: 0;
left: 0;
}
.bi span{
position: absolute;
visibility: hidden;
}
#nav li a,.bi:hover span{
line-height: 20px;
text-decoration: none;
background: #DDDDDD;
color: #666666;
display: block;
80px;
text-align: center;
}
#nav li a:hover,.bi:hover span{
color: #FFFFFF;
background: #DC4E1B;
}
.bi:hover span{padding-top: 2px;}
</style>
<body>
<ul id="nav">
<li><a class="bi" href=http://wuyisky.cnblogs.com>Home<span>首 页</span></a></li>
<li><a class="bi" href="http://wuyisky.cnblogs.com">CSS<span>样式表</span></a></li>
<li><a class="bi" href="http://wuyisky.cnblogs.com">样式表<span>CSS</span></a></li>
<li><a class="bi" href="http://wuyisky.cnblogs.com">首 页<span>Home</span></a></li>
</ul>