如何使用变量 CSS 选择器

Question

有谁知道如何使用变量 CSS 选择器？例如，我希望我的 CSS 获取可变的 table id 属性...类似于：

<table id="table_1">
    <thead>
    </thead>
    <tbody>
    </tbody>
</table>

<table id="table_2">
    <thead>
    </thead>
    <tbody>
    </tbody>
</table>

<table id="table_3">
    <thead>
    </thead>
    <tbody>
    </tbody>
</table>

现在我想通过他们的 id:

抢 tables

table#[INSERT VARIABLE TABLE ID HERE]{ 
  margin: 0 auto;
  border-collapse: collapse;
  font-family: Agenda-Light, sans-serif;
  font-weight: 100; 
  background: #333; color: #fff;
  text-rendering: optimizeLegibility;
  border-radius: 5px; 
}

提前致谢！

Answer 1

如果所有表都具有相同的 css，您可以使用 class 而不是 id。

无法在 css 中迭代或执行其他类型的逻辑。要使用变量，您可以使用 css 预处理器，如 sass 或更少，但您必须定义每个变量 "by hand"。

如何使用变量 CSS 选择器

How to use variable CSS selector

javascript

css

selector