Is there a CSS not equals selector?

by

In CSS3, you can use the :not() filter, but not all browsers fully support CSS3 yet, so be sure you know what you’re doing which is now
supported by all major browsers (and has been for quite some time; this is an old answer…).

Example:

<input type="text" value="will be matched" />
<input type="text" value="will not be matched" class="avoidme" />
<input type="text" value="will be matched" />

and the CSS

input:not(.avoidme) { background-color: green; }

Note: this workaround shouldn’t be necessary any more; I’m leaving it here for context.

If you don’t want to use CSS3, you can set the style on all elements, and then reset it with a class.

input { background-color: green; }
input.avoidme { background-color: white; }

More Related Contents:

  1. Why doesn’t nth-of-type/nth-child work on nested elements?
  2. CSS negation pseudo-class :not() for parent/ancestor elements
  3. How can I select the last element with a specific class, not last child inside of parent?
  4. How can I style even and odd elements?
  5. Matching the first/nth element of a certain type in the entire document
  6. Using CSS :before and :after pseudo-elements with inline CSS?
  7. Difference in applying CSS to html, body, and the universal selector *?
  8. How can I correctly select the first or the last child with CSS?
  9. Using :before and :after CSS selector to insert HTML [duplicate]
  10. What is syntax for selector in CSS for next element?
  11. :nth-child(even/odd) selector with class [duplicate]
  12. How to CSS: select element based on inner HTML [duplicate]
  13. What is the performance impact of the universal selector?
  14. What are the priorities among CSS selectors
  15. Why is nth-child selector not working?
  16. Default :target with CSS
  17. Can a ::before selector be used with a ?
  18. Avoiding repeated constants in CSS
  19. What is the ::content/::slotted pseudo-element and how does it work?
  20. How to run the CSS3 animation to the end if the selector is not matching anymore?
  21. Why does the general-sibling combinator allow toggling pseudo-element’s content, but not the adjacent-sibling?
  22. How to get CSS to select ID that begins with a string (not in Javascript)?
  23. How do I select an element that has a certain class?
  24. Selecting the last element among various nested containers
  25. Is there a reason to use a instead of a:link or a:visited in my stylesheet?
  26. Zebra striping a flexbox table with wrapping items
  27. How to use nth-child for styling with a table with rowspan?
  28. Hide element, but show CSS generated content
  29. How can I get a specific number child using CSS?
  30. Why does .class:last-of-type not work as I expect?

Leave a Comment