How to Target Elements with IDs Containing Specific Text in CSS?

CSS Selector to Target Elements with IDs Containing Specific Text

You have elements with IDs like the following:

<code class="html"><a> element with id = someGenerated Some:Same:0:name</a>
<a> element with id = someGenerated Some:Same:0:surname</a>
<a> element with id = someGenerated Some:Same:1:name</a>
<a> element with id = someGenerated Some:Same:1:surname</a></code>

You need a CSS selector to retrieve the elements with IDs containing "name". Using a[id*='Some:Same'] alone would return all elements, which isn't what you want.

Instead, use the following selector:

<code class="css">a[id*='Some:Same'][id$='name']</code>

This selector combines the substring and ending matches. It will select all elements with IDs containing "Some:Same" and ending in "name". This will accurately isolate the desired elements.

The above is the detailed content of How to Target Elements with IDs Containing Specific Text in CSS?. For more information, please follow other related articles on the PHP Chinese website!