某个类中所有 td 和 th 元素的单个 CSS 选择语句 [重复]答案

【问题标题】：Single CSS select statement for all td and th elements inside a certain class [duplicate]某个类中所有 td 和 th 元素的单个 CSS 选择语句 [重复]
【发布时间】：2020-12-30 04:57:18
【问题描述】：

这应该很简单，但答案让我难以捉摸。我有什么工作，但它由两个 select 语句而不是 1 组成。我想选择类 .table-std 的元素内的所有 th 和 td 元素。

我在表格中得到的结果是 table-std 类具有正确的边框（在表格周围和每个单元格周围，边框折叠）。其他不属于此类的表不受影响。

.table-std th {
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

.table-std td {
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

这会选择 .table-std 中的所有 td

.table-std th td {
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

这似乎选择了 .table-std 中的所有 td

.table-std th td {
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

这似乎选择了 .table-std 中的所有 th 和 td，但至少也选择了其他表中的所有 td。

.table-std th, td{
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

与此相同。

.table-std, th, td{
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

【问题讨论】：

stackoverflow.com/questions/29685752/… -- 看到这个。
我在想也许还有另一种方法来指定我缺少的类/元素之间的关系。不过，是的，这解决了我的问题。谢谢。

标签： css html-table css-selectors

【解决方案1】：

使用这个选择器：

.table-std th,
.table-std td {
    border: 1px solid var(--border-color);
    padding: 0.25em;
}

【讨论】：

【解决方案2】：

确保 .table-std 类仅与您要编辑的 th & td 相关联。

在你的问题中使用倒数第二个代码

【讨论】：