HTML怎么用div盒子做弹出式菜单，就是当鼠标移动到目标的超链接时，就会自动弹出一个菜单？ 5
<styletype="text/css">.tishi{position:relative;/*这个是关键*/z-index:2;}.tishi:hover{z-ind...
<style type="text/css">.tishi{position:relative; /*这个是关键*/z-index:2;}.tishi:hover{z-index:3;background:none; /*没有这个在IE中不可用*/}.tishi span{display: none;}.tishi:hover span{ /*span 标签仅在 :hover 状态时显示*/display:block;position:absolute;top:21px;left:9px;width:15em;border:1px solid black;background-color:#ccFFFF;padding: 3px;color:black;}</style><a class="tishi" href="#">On Here<span>Hello Word</span></a>这个菜单只有在鼠标停留在超链接时才会出现，一旦移走鼠标就会自动消失，据说是用层的隐藏与显示来实现？？求具体代码，最好简单明了，谢谢！ 关键是下面的Hello World怎么设置为超链接
展开
1个回答
展开全部
实现这个功能很简单，就是利用了hover加上display属性结合起来使用
还有一种原理，利用body的点击事件来操作元素的，也是可以的，但是要利用到js比较麻烦，下面的这个demo是只需要用到css就可以实现的
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>字符串连接</title>
<style type="text/css">
.tishi{
position:relative; /*这个是关键*/
z-index:2;
}
.tishi:hover{
z-index:3;
background:none; /*没有这个在IE中不可用*/
}
.tishi span{
display: none;
}
.tishi:hover span{ /*span 标签仅在 :hover 状态时显示*/
display:block;
position:absolute;
top:21px;
left:9px;
width:15em;
border:1px solid black;
background-color:#ccFFFF;
padding: 3px;
color:black;
}
</style>
<body>
<a class="tishi" href="#">On Here<span>Hello Word</span></a>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
