Question

可能重复：
How do I get this CSS text-decoration override to work?

Chrome和Firefox正在密谋阻止我尝试使用直通式文本修饰，有时会被跨度禁用，如下所示：

<style type="text/css">
tr.st td {
  text-decoration: line-through;
}

tr.st td span.unstrike{
  text-decoration: none;
  background:yellow;
}

tr.st td span#unstrike-id{
  text-decoration: none;
  background:yellow;
}

tr.st td span.unstrike-important{
  text-decoration: none ! important;
  background:yellow;
}

</style>


<table  border>
    <tbody>
      <tr>
        <td>normal</td>
      </tr>
      <tr class="st">
        <td>struck out</td>
      </tr>

      <tr class="st">
        <td>struck out <span class="unstrike">unstrike class: shouldn't I be normal?</span></td>
      </tr>

      <tr class="st">
        <td>struck out <span id="unstrike-id">unstrike-id identifier.  Shouldn't I be normal?</span></td>
      </tr>

      <tr class="st">
        <td>struck out <span class="unstrike-important">unstrike-important: shouldn't I  be even more normal?</span></td>
      </tr>
    </tbody>
  </table>

我眯着眼睛看着这个规格，但是我没理解。

文本去处理的特例？是什么给了什么？

demo here

Answer 1

如果您具有要使用该属性的行装饰的特定序列，则可以使用:nth-child()

或者尝试将线条装饰添加到span，而不是添加到td。看看我的例子：jsfiddle

Answer 2

直击应用于表格单元格，而不是它的内容。类似的情况是将边框应用于<td>。移除跨度上的边框不会阻止td上的边框闪烁。

您可以在跨度中添加不透明背景。

添加：

position: relative;
display: inline-block;
top: 0px;

seems to fix it.

Answer 3

看起来这是几个问题的骗局，特别是：

How do I get this CSS text-decoration override to work?

简而言之，http://www.w3.org/TR/CSS21/text.html#propdef-text-decoration处的语言（对我非常模糊）说“没有覆盖”。

主持人/编辑，请将我作为骗子关闭。

我不能将文字装饰覆盖为无？

3 个答案: