CSS selector for classless

Question

I use a selector to select all elements that do not have one class:

.list th:not(.foo) { /* some rules */ } 

How can I apply this to multiple classes?

 .list th:not(.foo), .list th:not(.bar) { /* some rules */ } 

The CSS above will certainly not do this, I need something like this pseudo:

 .list th:not(.foo and .bar) 

Is this possible in CSS and how?

Answer 1

You can use as many selectors as possible :not() .

 :not(.foo):not(.bar) 

Answer 2

With upcoming CSS4 selectors, you can use syntax like:

 :not(.class1, .class2, .class3) 

etc. But browser support is not very good so far. To use it today, you can use cssnext .

Answer 3

 .list th:not[class*="class"] { } 

It will work with all classes such as class1, class2, etc.

Answer 4

Using a comma to separate a class name may make you want

 .list th:not(.class1, .class2)