css - 在 css 中使用正则表达式？

Question

我有一个带有 div 的 html 页面，其 id(s) 的形式为 s1、s2 等等。

<div id="sections">
   <div id="s1">...</div>
   <div id="s2">...</div>
   ...
</div>

我想将 css 属性应用于这些部分/div 的子集(取决于 id)。但是，每次添加 div 时，我都必须像这样分别为该部分添加 css。

//css
#s1{
...
}

我可以使用 css 中的正则表达式将样式应用于一组 div。

Answer 1

如前面的答案所示，您可以在没有任何形式的正则表达式的情况下管理选择这些元素，但是要直接回答问题，是的，您可以在选择器中使用某种形式的正则表达式:

#sections div[id^='s'] {
  color: red;
}

<div id="sections">
  <div id="s1">one</div>
  <div id="s2">two</div>
  <div id="s3">three</div>
  <div id="t1">four</div>
</div>

也就是说，选择 #sections div 中 ID 以字母“s”开头的任何 div 元素。

参见 fiddle here .

W3 CSS selector docs here .