Is there a CSS selector for any attribute with a specific value?

Viewed 763

Is there a CSS selector that can target a specific attribute value regardless of its attribute? I am looking for something like [*="value"] (using a wildcard) or {value} (a direct value selector).

2 Answers

No. CSS attribute selectors are designed to select based on the attribute (hence the name). If you want to select something based on a value rather than an attribute or attribute value, then just use CSS classes.

Alternatively, you can write a verbose selector that includes all the attributes your document will contain (because you should know that information ahead of time), e.g.:

div[data-value="value"], div[href="value"], div[hello="value"], div[goodbye="value"] {
    color: red;
}
<div data-value="value">Red</div>
<div>Black</div>
<div href="value">Red</div>
<div hello="value">Red</div>
<div goodbye="value">Red</div>
<div>Black</div>
<div>Black</div>

Related