与z-index相关的Css菜单/子菜单问题

时间:2013-08-03 09:20:34

标签: html css

我的导航栏CSS存在问题。 我希望它看起来像: http://i39.tinypic.com/28is4uw.png

但这就是我得到的: http://i40.tinypic.com/akecl5.png

让我这样做的唯一方法是使用:

.under-menu { position: relative;  z-index:999; }

但这会导致submenu links

非常感谢!

1 个答案:

答案 0 :(得分:0)

不是一个完美的解决方案,但如果我们想要支持IE,至少有一些,如果不只是添加

pointer-events: none;

将解决问题。该演示不包括指针事件。

这是一个演示: CSSDesk

总之,我在下拉列表中添加了wave背景(在链接和drop ul所在的li中),并且第二次尝试的效果几乎相同,只有我屏蔽顶部的区别我在LI中添加的背景下拉。 你会看到波浪背景阴影成为自动收报机,因为其他背景仍然存在(你可以用JS隐藏它然后它会变得更好,但因为这只是一个html / css主题我不添加任何JS)< / p>

因此,当您将鼠标悬停在LI元素上时,将显示叠加背景。 因此,应为每个li添加下拉背景。 (就像我说的不是一个完美的解决方案)