Luca Detomi
Luca Detomi

Reputation: 5716

CSS: "Attribute selector" and "not()" together

I have the following rule:

a:not(.ui-spinner-button):active 
{
  ...
}

I would like a more general rule specifying that "style must applied to all A tag that does NOT have a class name that begin with 'ui-' ".

So, I should "merge" this kinf of definition [class*='ui-'] with not().

Is possible in some way? Thank you.

Upvotes: 0

Views: 51

Answers (1)

Alessandro Vendruscolo
Alessandro Vendruscolo

Reputation: 14877

Yes, it's possible, just put [class*='ui-'] inside a not().

a {
    color: cyan;
}

a:not([class*='ui-']) {
    color: pink;
}

<a class='ui-foobar'>ui-foobar</a>
<a class='foobar'>definitely not ui-foobar</a>

The first link will be cyan, the second one pink.

Demo

Upvotes: 1

Related Questions