CSS use :not ID with CLASS

问题:

Does someone know how to use the CSS selector :not() as #some_id:not(.any_class_name)?

The code looks as if it is right, but it doesn't work. Is there another way without the not selector? I couldn't find anything on the Internet.

I am making a web application, which includes more than one page, but several pages have divs with id=some_id. I thought I had to add specific CSS by adding any_class_name one time using the above CSS code solve the problem, but it doesn't work.

回答1:

I believe that you are reversing the selectors. You have some elements with the same class, but you want to filter out an element with an specific ID. In that case:

HTML:

<p class="someclass">hello</p> <!-- will be targeted by css below, thus green -->
<p class="someclass" id="some-id">hi</p> <!-- will not be targeted by css below -->

CSS:

.someclass:not(#some-id){ color: green; } 
/* selects all elements with classname 'someclass', 
   but excludes the one that has also has an id of 'some-id' */

And as @secretSquirrel pointed out, note the browser compatibility: this selector is not supported by Internet Explorer 8 and older.

回答2:

This will set all the backgrounds except the ones that has <a></a>:

:not(a)
{
     background: gray;
}

回答3:

I hope this will help you.

Demo

Another way is: You can override the css. May be you want something like this.

<div id="demo">
<p class="class">This is a paragraph.</p>
<p>This is another paragraph.</p>
</div>

Your css

#demo
{
color:#0000ff;
}
.class
{
color:#ff0000;
}