更改 span 类中链接的颜色答案

【问题标题】：Change color of link inside span class更改 span 类中链接的颜色
【发布时间】：2017-04-14 01:15:03
【问题描述】：

我有：

<span class="field-content highlight-front">
   <a href="/node/42" hreflang="en">This is an example</a>
</span>

在 css 文件中，我想使用 span 类更改链接的颜色。

.highlight-front{ 
   color: blue;
}

但这似乎不起作用。关于通过跨度类定位链接的任何建议或阅读地点？

【问题讨论】：

.highlight-front a { color: blue; }

标签： html css class hyperlink colors

【解决方案1】：

您必须在 span 内指定元素进行着色，这意味着在您的类名（span 的子级）之后添加 a：

使用这个：

.highlight-front a{ 
   color: blue;
}

看这里：

https://plnkr.co/edit/Tn3IomLmUaobN59Cdg4j?p=preview

【讨论】：

【解决方案2】：

您可以通过以下方式实现：

<span class="field-content highlight-front">
    <a href="/node/42" hreflang="en">This is an example</a>
</span>

.highlight-front a{ 
    color: blue; 
 }

这将为发现作为.highlight-front 类的后代的任何<a> 着色。

【讨论】：

【解决方案3】：

在类中添加.highlight-front a{ 以指定span 内的所有a 标签与类highlight-front

.highlight-front a{ 
   color: blue;
}

<span class="field-content highlight-front">
   <a href="/node/42" hreflang="en">This is an example</a>
</span>

【讨论】：

【解决方案4】：

you can also try this
<span class="field-content">
   <a class="highlight-front" href="/node/42" hreflang="en">This is an example</a>
</span>

【讨论】：