css - 如何清除表格行中元素的直通线？

Question

我在“清除”我在表格行上使用的直通线时遇到问题。我不想在链接上产生直通效果。我正在使用 Javascript 动态更改 tr 类，因此我希望它尽可能简单。

我当前的代码:

HTML:

<table>
<tr class="table-item">
<td>Text</td>
<td><a href="#">Delete item</a></td>
</tr>
</table>

CSS:

.table-item td {
text-decoration: line-through;
}
.table-item a {
text-decoration: none;
}

有什么建议吗？

Answer 1

我在 jsFiddle 玩过它.似乎唯一的方法是将您想要 line-through 的其他内容包装在另一个元素中，例如 span。

更新:根据要求来自 jsFiddle 的代码:

<table>
  <tr class="table-item">
    <td><span>Text</span></td>
    <td><a href="#">Delete item</a></td>
  </tr>
</table>

CSS:

.table-item td span {
  text-decoration: line-through;
}