html - 对象前面的 Z-index 但仍保持对象功能

Question

我有一个由 css 控制的导航栏，它工作得很好，有悬停效果，问题是我有一个我无能为力的链接，我希望该链接位于导航栏的顶部而不禁用悬停效果。该链接附有一个下拉菜单，我想保留它。我无法对此链接做任何事情的原因是因为我使用的是设计平台像这样工作:编辑 -> Toprow 对象:导航菜单(链接)- HTML 文档(我的导航栏)- 搜索字段。(我通过插入对象修改外观)当我发现 z-index 时，我以为我已经明白了。但是，当我这样放置代码时:

.main-nav-top {
    background: black url("picture");
    border-bottom: 1px solid #a4a4a4;
    border-top: 1px solid #a4a4a4;
    height: 47px;
    width: 1070px;
position:absolute;
left:0px;
top:0px;
z-index:-1;
}

下拉效果很好，但悬停效果消失了

当我这样写代码时:

.main-nav-top {
    background: black url("Picture");
    border-bottom: 1px solid #a4a4a4;
    border-top: 1px solid #a4a4a4;
    height: 47px;
    width: 1070px;
position:absolute;
left:0px;
top:0px;
z-index:+1;
}

悬停效果很好，但与下拉菜单的链接消失了。有什么办法可以解决这个问题吗？

Answer 1

好吧，为此你不能做任何事情，除了在它上面创建另一个元素并使其在 0.1 秒后可见(这样你的动画仍然有效)。当新元素变得可见时，它将替换动画元素，从而愚弄人们。