Question

我正在使用数据表并使用下面的css来隐藏表格的标题。

table.dataTable thead {
    display: none;
}

现在发生的事情是我有两个表格为userList1＆amp; userList2。

我想要做的是仅将此css应用于ID为userList1的表。

知道如何完成这项工作吗？

我试过

#userList1.table.dataTable thead {
    display: none;
}

#userList1 > table.dataTable thead {
    display: none;
}

但没有一个正在发挥作用。

我不确定上面是对还是错，但我试过了。我是CSS的新手。

HTML代码

表1

<table id="userList" class="responsive dataTable" dir="LTR" style="width: 100%;border: 0px;" aria-describedby="userList_info">

表2

<table id="userList:2:userList2" class="responsive appointments" dir="LTR"></table>
<table id="userList:1:userList2" class="responsive appointments" dir="LTR"></table>
<table id="userList:0:userList2" class="responsive appointments" dir="LTR"></table>

注意：我有两张桌子..

表1的内部表格如表2所示......

所以我的表是

<table id="userList" class="responsive dataTable" dir="LTR" style="width: 100%;border: 0px;" aria-describedby="userList_info">

    <table id="userList:2:userList2" class="responsive appointments" dir="LTR"></table>
    <table id="userList:1:userList2" class="responsive appointments" dir="LTR"></table>
    <table id="userList:0:userList2" class="responsive appointments" dir="LTR"></table>

</table>

注意我使用的是JSF语言，而内部表ID是由JSF创建的......

JSFiddle Link

Answer 1

如果要隐藏外表的标题：

#userList thead {
  display: none;
}

如果要隐藏内部表格标题的所有：

#userList table thead {
  display: none;
}

如果你想隐藏其中一个内部表的标题，基于@ steveax的解决方案：

#userList #userList\:2\:userList2 thead {
  display: none;
}

Answer 2

试试这个：

#userlist.dataTable thead {
display:none;
}

你shuold使用display：none;仅适用于您要隐藏它的标题。

只隐藏一个可以使用内联样式的文件。

    <table id="userList" class="dataTable" border="1">
        <thead style="display:none;">
            <tr>
                <td>This is what I want to hide</td>
            </tr>
        </thead>

<强> JSFIDDLE

如何使用ID定位表？

JSFiddle Link

2 个答案: