不同的悬停链接颜色为粗体文本和普通文本

Question

我知道这是一个愚蠢的问题，但是如何为粗体和普通文本设置不同的悬停链接颜色。

a:hover { color:#cccccc; }

<b> 
 
<a href="google.com"> A Bold link</a> 
 
</b> 
 

 
<p><a href="google.com"> A normal link</a>

Answer 1

你应该只使用不同的选择。一个与b父母和另一个没有。 只要使用超链接周围的b标签实现粗体链接文本，就可以工作。

a:hover { 
 
    color: #cccccc; 
 
} 
 
b > a:hover { 
 
    color: #cccc00; 
 
}

<b> 
 
<a href="google.com"> A Bold link</a> 
 
</b> 
 

 
<p><a href="google.com"> A normal link</a>

Answer 2

请添加此CSS：

b a:hover { 
    color: #ff0000; 
} 
p a:hover { 
    color: #008000; 
} 

Answer 3

你可以使用样式

a{ color: red; } 
b a{ color: blue; } 

<b> 
    <a href="google.com"> A Bold link</a> 
</b> 

<p><a href="google.com"> A normal link</a> 

表明观点：csstricks https://css-tricks.com/