CSS:从文本中删除下划线

Question

我有以下 HTML

<div style="text-decoration: underline;">
    outer text
    <div style="text-decoration: none;">inner text</div>
</div>

即使我对“内部文本”使用了“无”，它仍然带有下划线。这是 JS fiddle 示例:http://jsfiddle.net/oj2wj1d6/1/

如何去掉“内部文本”的下划线？我必须保持相同的 HTML 结构而不添加任何新的 HTML 标记。

Answer 1

这实际上是the spec中定义的行为:

Text decorations draw across descendant elements. This means that it is not possible to disable on a descendant a text decoration that is specified on one of its ancestors.

更多详情请访问 https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration