关于css二级菜单显示， 看了一个例子， 鼠标放在一级菜单时候， 二级菜单就显示出来了
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了关于css二级菜单显示， 看了一个例子， 鼠标放在一级菜单时候， 二级菜单就显示出来了相关的知识，希望对你有一定的参考价值。
关于css二级菜单显示， 看了一个例子， 鼠标放在一级菜单时候， 二级菜单就显示出来了，但是css里面不是用的hover 或者 js 的 onmouseover， 只是简单的div， 不同的是css里面有一个visibility:hidden; opacity:0; 用了这个语句就实现了上述功能， 谁能解释一下，还是我没看懂？
写了以下代码希望能理解<html>
<head>
<title>【hover是鼠标放在a标签上触发事件的css伪类】</title>
<style type="text/css">
/*二级菜单默认隐藏*/
spanvisibility:hidden
/*鼠标触发A标签实现A标签能影响到下面的所有标签【鼠标放到A标签上SPAN标签显示】*/
a:hover spanvisibility:visible
</style>
</head>
<body>
<a>
我是一级菜单
<!--二级菜单默认隐藏-->
<span>我是二级菜单</span>
</a>
</body>
</html> 参考技术A visibility:hidden; 表示隐藏这个块
opacity:0； 表示透明度为0 完全透明 参考技术B 是用 a:hover divdisplay:block 参考技术C 。。。。
滚动条挡住hover内容
这是一个另类的方法！！！！
情况如下（图是盗了，刚好自己在查找解决方案的时候看到的）：
设置了高度和overflow，会出现滚动条，但是二级菜单出不来，网上看了挺多解决办法：
1、js模拟滚动条（瞎搞了下，没弄出来）；
2、将二级菜单的内容移到一级菜单外面，通过js分别定位，去显示（没尝试）；
自己则是采用在鼠标在该区域下，监听鼠标滚轮事件，然后改变模块的position和top的值，来模拟出滚动效果，没有那个很丑的滚动条，显示效果就比有滚动条的好看很多。效果如下：
监听滚轮事件详见：http://www.cnblogs.com/Gaoswatou/p/6910647.html（项目是在xp系统下的更应该看下 ^.^）。
G~G~ Study。
以上是关于关于css二级菜单显示， 看了一个例子， 鼠标放在一级菜单时候， 二级菜单就显示出来了的主要内容，如果未能解决你的问题，请参考以下文章
为啥css做的二级导航，当鼠标停留在一级上时候，二级菜单正常显示。当鼠标移动到二级菜单，