0

我正在使用 Css3 效果使我的菜单看起来更漂亮，但这没有问题，但是我不知道由于一些奇怪的原因，当我单击菜单项时，它们不会重定向到所需的页面，即我的 href="abc.aspx" 不会在 Firefox 、 Opera 中工作，但在 Chrome 中工作得很好。这是我使用的 Css3 代码

#Menu a:active,
#Menu a.active:before,#Menu a:hover:before
{
    Content: ' ';
    position:absolute;
    z-index:-1;
    width:0px;
    height:0px;
    left:50%;
    top:50%;
    border-radius:50%;
    box-shadow:0 0 35px 30px #ADD7E7;

}

我的菜单看起来有些东西像这样

但是，当我删除该 Css3 样式时，href 有效。任何人都可以帮助我解决为什么会发生这种情况。欢迎任何建议。

谢谢

4

3 回答 3

2

这很可能是因为您的 css 中的这一行：

z-index:-1;

默认层是0文档的，但由于悬停时您将其设置为-1，因此您将无法单击它。

于 2012-05-07T05:41:51.567 回答
2

问题可能源于样式#Menu a:active与伪元素一起。尝试将它们分开，甚至#Menu a:active完全从定义中删除。然后你可以设置你的z-index背，-1 因为它只会被应用于伪元素。

我在这里设置了一个 jsfiddle。

于 2012-05-07T07:37:58.973 回答
1

将z-index:-1元素放在身体后面。因此，它不能被点击，因为身体正在遮挡它。

但是，如果您没有为主体定义背景颜色，这有点模棱两可，因为透明背景颜色可能无法捕捉到点击。

避免负 z 索引。它们可以在正数中随心所欲地升高，比负数更可靠。

于 2012-05-07T05:41:52.157 回答