更改链接样式，仅适用于某个类

Question

我想更改某些链接的链接样式，例如：

a:hover
{
    /* These links will be blue when hovered-over */
    background-color: #3366FF;
}

但是，我只想让它在我的导航栏中生效，而不是常规链接。

我尝试过这方面的变体：

#navbar a:hover
{
    /* These links will be blue when hovered-over */
    background-color: #3366FF;
}

具有预期含义“这仅适用于<div id="navbar">”的链接 但它没有用。

如何为仅由其容器的class或id定义的特定链接设置样式？

Answer 1

对我来说没问题，Robusto有一个使用颜色的有效点。

另一种方法是给链接一个属于自己的类，例如：

<强> CSS

a.navlink:visited 
a.navlink:hover
{
    background-color: #3366FF; 
}

<强> HTML

<a href="index.html" class="navlink">Home</a>

Answer 2

也许您测试的链接是访问过的链接。 我更喜欢：

#navbar a:hover,
#navbar a:visited
{
    background-color: #3366FF;
}

Answer 3

我想你可能想在这里使用“color”属性而不是“background-color”。

如果偶然你做想要改变背景颜色，请记住链接显示内联并且周围没有宽大，舒适的矩形，因此根据容器的背景颜色而定可能不会引人注意。 （可能情况并非如此，但是如果您的链接非常小，我会把它扔掉。）

最后，由于蓝色接近默认链接颜色，因此请考虑使用异国色（如红色）进行测试，以查看问题是在CSS还是颜色选择中。