如何将"display：none;"应用于除"<td class= "cc" >text"之外的所有内容</td>？

所以我尝试了：

    body :not(.cc) { display: none; }

以及我在这里发现的其他各种东西。(!important，*代替身体，...(我什至尝试使用该类而不是TD元素的跨度元素。什么都没有。

<html>
<body>
<table><tr><td class="cc">text</td></tr></table>
Other text to not ne shown.
</body>
</html>

编辑：请原谅我首先在这里放一个误导性的html-snippet。我删除了。
edit2：我添加了"其他文本未显示。"

您将需要类似的东西

body *:not(table):not(tr):not(td):not(tbody),
td:not(.cc) {
  display: none;
}

<table>
  <tr>
    <td>hide</td>
  </tr>
  <tr>
    <td class="cc">show</td>
  </tr>
  <div>Other text to not be shown.</div>
</table>

基本上，除了表元素外，将所有内容都隐藏在身体中，然后第二个规则隐藏了不是.cc类的td。我添加了tbody，因为有些浏览器会自动将其添加到您的表中。经验的基本规则是，您不能隐藏任何包含要显示的元素的父母。

就文本而言，您需要将文本包裹在元素中，以便可以用CSS定位。目前，它被车身标签包裹，您无法隐藏身体标签，否则将没有显示任何内容。

您可以参考文本节点样式的此问题

您无法显示.cc类，因为它内部隐藏的身体！如果你想要

，你可以这样做

p:not(.cc) { 
display: none; 
}

    <p>text get's hidden</p>
    <p class="cc">text doesn't get hidden</p>
    <p>
    hello world!
    </p>

为什么不首先将所有内容设置为所有内容，而您的班级则是：

    body { display : none ; }
    .cc  { display : block; }

相关内容