下面的代码就是css实现的鼠标悬停,你看下是不是你要的。不行就追问我。可能样式不是你想要的,你可以自行修改一下样式。
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0padding:0}
ul{list-style-type: none}
ul>li{float:leftmargin-right: 10pxposition: relativewidth:100px}
li>span{display: noneposition: absolutetop: 20pxbackground: #ccc}
li:hover >span{display: block}
</style>
</head>
<body>
<ul>
<li>提示<span>任务中心</span></li>
<li>提示<span>通知</span></li>
<li>提示<span>装扮</span></li>
</ul>
</body>
</html>
这个要配合JS的,单用css做不到,如果你用DW做的话,里边有默认的JS特效可以实现这个效果,如果你用其他编辑器的话可以找个JS自己添加,不过可能需要你后期对JS进行修改,不过不复杂,<script type="text/javascript">
function show(){
var show=document.getElementById("div")
show.style.display="none"
}
</scirpt>
这是一个简单实现隐藏效果的JS,需要在连接上设置经过或者点击实现效果,就是onmouseover或者onclick。
当然这个JS不够用,需要扩展,你就看着扩展吧,只要对CSS熟悉应该很简单吧。