CSSで正規表現を使用するには?質問する

CSSで正規表現を使用するには?質問する

div要素を含むHTMLページがあります。id(s)の形式のs1s2等々。

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

これらのセクション/divのサブセットにCSSプロパティを適用したいのですが(IDによって異なります)。しかし、分割、セクションの CSS を次のように個別に追加する必要があります。

//css
#s1{
...
}

CSSに正規表現のようなものがあって、それを使って一連のスタイルを適用できるのでしょうか?div要素

ベストアンサー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 内で、文字「s」で始まる ID を持つ div 要素をすべて選択することを意味します。

見るここでフィドル

W3 CSSセレクターのドキュメントはこちら

おすすめ記事