Question

我的ul列表存在问题：

<ul>
    <li>
        <a href="#">My Gifts</a>
        ...code... 
        <div class="add">
            <a href="#">add</a>
        </div>
    </li>
</ul>

当我将鼠标悬停在＆＃34;我的礼物＆＃34;链接，它显示之后的内容。当我徘徊＆＃34;我的礼物＆＃34;我有背景图像显示背后＆＃34;我的礼物＆＃34;。

坚持＆＃34;添加＆＃34;链接，我怎么能分开或一些如何只做＃34;我的礼物＆＃34;链接获得悬停效果？

Answer 1

这将只选择第一个a因为它没有包含在div

中

li > a:hover {
     background-color: red;
    }

Answer 2

在您的css文件中，您可以添加

.add a{
    background:transparent
}

Answer 3

如果您只想我的礼物采取悬停效果，请尝试：

<a href="#" class="hover-able">My Gifts</a>

然后添加这个CSS：

a.hover-able:hover {
    /* hover style here */
}

不要将此类添加到其他元素

导航悬停背景错误

3 个答案: