How to Exclude Particular Class Name in CSS Selector

How to exclude particular class name in CSS selector?

One way is to use the multiple class selector (no space as that is the descendant selector):

.reMode_hover:not(.reMode_selected):hover {   background-color: #f0ac00;}
<a href="" title="Design" class="reMode_design  reMode_hover">    <span>Design</span></a>
<a href="" title="Design" class="reMode_design reMode_hover reMode_selected"> <span>Design</span></a>

Exclude a class from all of the selectors in CSS

It is possible with CSS4 :is selector. You can watch out for the browser support here: https://caniuse.com/?search=is but in modern web developer terms, you are safe to use it.

:is(h1,h2,h3):not(.exclude) {
background: #bada55;
color: #565656;
padding: 10px;
}
<h1 class="exclude">
Excluded
</h1>
<h2 class="include">
Included
</h2>
<h3 class="exclude">
Excluded
</h3>

using :not to exclude classes in css

Try Like This,

.basket-items li span:not(.name):not(.count) {
border:solid 1px #ddd;
border-radius:50%;
}

How do I exclude a particular class from a CSS property?

The a:not(.selected) is rereferring to an <a> tag selector but your HTML code has no class at all, only the <img/> within it has a selected class.

Consider why your image has this class, what toggles it.

Probably it should be moved to the parent <a> tag

How can I exclude all except a specific css class?

The problem was insufficient specificity.

This works:

.q-item
&.disabled
opacity: 1.0 !important
button.q-btn
cursor: pointer !important
&, *:not(.q-btn)
cursor: default !important


Related Topics



Leave a reply



Submit