Question

好的，这是我的问题，我有一个带有悬停效果的div，它会在鼠标悬停在div上时改变颜色，反过来文本会反转颜色以使其保持可读性。现在我的问题是链接本身不遵循颜色方案，并且在鼠标悬停在链接本身上之前，在div之外攻击它们自己的链接将不起作用。任何人都可以指出我正确的方向。

HTML

<div id="gs_home_blackbar">
<div id="ic_box_1"><span style="LINE-HEIGHT: 24px; FONT-SIZE: 20px"><strong>An Emerging Leader </strong></span><br />
This is where text goes</div>

<div id="ic_box_2"><br /> This is where text goes</div>
</div>

<div id="ic_box_3" class="a"><br /><br /><a href="#">This is where my link goes</a></div>
</div>

以下是控制此部分的CSS

#ic_box_3 {
    color:#fff;
    position:absolute;
    background:#000;
    margin:-130px 0px 0 860px;
    padding:27px 10px 10px 10px;
    text-align:left;
    width:230px;
    height:93px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#fff;
    border-left:dotted 1px #fff;
    }
    #ic_box_3:hover {
    position:absolute;
    background:#fff;
    margin:-130px 0px 0 860px;
    padding:27px 10px 10px 10px;
    text-align:left;
    width:230px;
    height:93px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#000;
    border-left:dotted 1px #000;
    }

Answer 1

使用这样的选择器：

#ic_box_3:hover a {
  /* settings for anchors inside a hovered div */
}

然后，如果你需要两者都悬停的情况，请使用这个：

#ic_box_3:hover a:hover {
  /* etc */
}

Answer 2

看起来你正试图让链接看起来像一个悬停在效果上的按钮。你没有把它放在div中并设置div的样式。您可以设置锚标记本身的样式。基本上将您提供给div的所有样式应用于锚本身并根据需要进行调整。

帮助控制div中的链接

2 个答案: