css - 删除父元素带下划线的嵌套元素中的下划线？

Question

<p style="text-decoration: underline;">Click Me<sup style="text-decoration: none;">?</sup></p>

我试图将一个元素嵌套在一个具有下划线属性的元素中，但为嵌套元素删除该属性。它不起作用，? 在这种情况下仍带有下划线，添加 !important 也无济于事。

编辑:实际元素在缩写中:

<tr>
  <th class="text-center" "text-decoration: underline;"><abbr title="Due Monthly" data-toggle="tooltip" data-placement="top">Actions<sup>?</sup></abbr></th>
</tr>

所以我不能让 sup 在 th 之外，因为它在 tr 中是无效的。

Answer 1

子元素的样式不会改变父元素的样式。

你可以这样做:

<p>
    <span class="underline">Click Me</span>
    <span>?</span>
</p>