覆盖下划线在另一个元素下面的元素下划线

我的问题几乎完全相同：How do I get this CSS text-decoration override to work?。但我看到这个问题已经7岁了，我想知道我们现在有没有办法实现这个目标？覆盖下划线在另一个元素下面的元素下划线

基本上我有看起来像这样的结构：

<a href='abc'> 
 
    This is underlined <span>But not this.</span> 
 
</a>

我只想span下的文本不被强调。我明白我可以使用边框底部并实现此目的。或者从a标签中删除下划线，并在span中插入我想要用下划线标出的文字。

我只想知道7年后现在是否有方法在子元素中覆盖text-decoration: underline。

来源

2017-01-18 Yathi

如果你想吸引新的答案，以一个老问题，考虑在其发布赏金。不要问一个重复的问题。 – Quentin

@Quentin：即使问题有答案被接受？我不确定赏金是如何工作的。请原谅我的无知。我也不想失去我的声誉，我认为这是一个公平的问题。 – Yathi

-1

使用CSS来实现你想要的。

a span { 
 
    text-decoration: none !important; 
 
    display: inline-block; 
 
}

<a href='abc'> 
 
    This is underlined <span>But not this.</span> 
 
</a>

来源

2017-01-18 19:16:12

如果我误解了你的问题，我很抱歉。但我以为你想要强调'这是加下划线'文本，并从'但不是这个'文本删除下划线 –

@Yathi你试过吗？它确实有效。你也可以在代码片段中看到。 – sh0ber

@ sh0ber：是的。它确实适用于我觉得更加混乱的代码片段。但在我的html上，它的行为就像在我的文章中的原始问题中提到的那样，即使使用'！important'标签。我也尝试在chrome中的'element.style'上应用样式。仍然没有去，我有下划线。它很难说服，否则我现在就放弃这一点。 – Yathi

覆盖下划线在另一个元素下面的元素下划线

回答

相关问题