在 css 中使用正则表达式? [英] Using regular expression in css?

问题描述

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

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

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

//css#s1{...}

是否有类似 css 中的正则表达式之类的东西，我可以使用它来将样式应用于一组 div.

解决方案

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

#sections div[id^='s'] {红色;}

<div id="s1">one</div><div id="s2">两个</div><div id="s3">三</div><div id="t1">四</div>

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

请参阅此处的小提琴.

此处为 W3 CSS 选择器文档.

I have an html page with divs that have id(s) of the form s1, s2 and so on.

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

I want to apply a css property to a subset of these sections/divs (depending upon the id). However, every time I add a div, I have to add the css for the section separately like this.

//css
#s1{
...
}

Is there something like regular expressions in css that I can use to apply style to a set of divs.

解决方案

You can manage selecting those elements without any form of regex as the previous answers show, but to answer the question directly, yes you can use a form of regex in selectors:

#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>

That says select any div elements inside the #sections div that have an ID starting with the letter 's'.

See fiddle here.

W3 CSS selector docs here.

这篇关于在 css 中使用正则表达式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！