2

可能重复:
如何让这个 CSS 文本装饰覆盖工作?

Chrome 和 Firefox 正在密谋阻止我尝试使用 td 与 line-through text-decoration,有时会被跨度禁用,如下所示:

<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>

我眯着眼睛看规格,我不明白。

文本修饰的特殊情况?是什么赋予了?

演示在这里

4

3 回答 3

0

删除线应用于表格单元格,而不是其内容。类似的情况是对<td>. 删除 span 上的边框不会阻止 td 上的边框通过。

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


添加:

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

似乎修复它。

于 2012-06-18T07:42:39.250 回答
0

看起来这是几个问题的欺骗,特别是:

如何让这个 CSS 文本装饰覆盖工作?

简而言之,http ://www.w3.org/TR/CSS21/text.html#propdef-text-decoration 上的(对我来说非常模糊)语言 说“没有覆盖”。

版主/编辑,请关闭我作为一个骗子。

于 2012-06-18T07:48:09.383 回答
0

如果你有一个特定的序列来使用属性,你可以使用:nth-child()

或者尝试将 line-decoration 添加到 span,而不是 td. 看我的例子:jsfiddle

于 2012-06-18T07:39:12.767 回答