Question

我正试图隐藏它：

<thead>
<tr>
<th class="col-image all" data-name="image" data-orderable="false" data-searchable="false" data-width="200px" data-priority="4">Image</th>
</tr>
</thead>

这是我的尝试：

thead.col-image all {
  display: none;
}

^这不起作用-知道吗？

谢谢！

Answer 1

thead.col-image all表示<all>中的<thead class='col-image'>个标签

您的代码的正确CSS应该是

thead .col-image.all {
  display: none;
}

https://jsfiddle.net/pb5k4v63/26/

Answer 2

您在调用错误的元素，并且“ all”也不是选择器；

thead.col-image all {} // is calling e.g. <thead class="col-image">

应该是

thead tr th.col-image.all { display: none; }

Answer 3

带有<th>标签的标题将消失。

根据您的要求为<th>或<td>或<tr>添加一个类。并为该类申请财产 {visibility：hidden}不会影响表格的对齐方式。 {display：none}可能会影响对齐方式（尽管可以。）

Answer 4

您可以将class用于td th或在要隐藏的文本上添加跨度并为其添加class

.hide{
  visibility:hidden;
}

<table>
<tr>
<td>hello</td>
<td class="hide">hide me</td>
<td>and also <span class="hide">hide me</span></td>
</tr>
</table>

Answer 5

TL; DR 在<thead>元素内包裹<th>，<table>等。另外，请确保在CSS中调用正确的元素。

HTML表是用<table>标记定义的。

因此，从本质上讲，您有<th>，<thead>等元素在<table>之外运行，因此您在破坏代码是因为<th>，{{ 1}}等要求父元素<thead>正常运行。

您为什么会问？如上所述，表格是用<table>标记定义的，因此您的页面上实际上没有表格。

结论是“现在将表中的行，标题等包裹在<table>元素中。

代码如下：

HTML

<table>

CSS

<table>
<thead>
<tr>
<th class="col-image all" data-name="image" data-orderable="false" data-searchable="false" data-width="200px" data-priority="4">Image</th>
</tr>
</thead> 
</table>

您可以在此处实时查看代码：https://jsfiddle.net/W3Develops/nbf17pus/6/ 我还在那里添加了另一个表格，因此您可以看到如何正确制作表格。

这里是Mozilla开发人员网络和W3Schools的链接，因此您可以了解有关制作表的更多信息。祝你好运：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table

https://www.w3schools.com/html/html_tables.asp

当您应该为th.col-image.all{ display: none; }调用类时，您也在为thead调用类。

干杯。

如何在表格HTML代码中从<TR>隐藏此特定文本

5 个答案: