Selector - Logical Pseudo-Class

Chrome Devtool Selector


Logical Pseudo-class are:

that return a boolean value (ie logical). They are predicate expression.


Example of a selector when the element has the class fade but not the class show, the opacity will be 0

.fade:not(.show) {
    opacity: 0;

Discover More
HTML - The class attribute

The class attribute is a global attribute (ie Every HTML element may have a class attribute specified) that permits to (select|categorize) elements. Assigning classes to an element affects: class matching...
Chrome Devtool Selector

Note that ordering matters in the above selector. Swapping the nesting of the two pseudo-classes would result matching any nth-child and last-child are child selector
Chrome Devtool Selector
Selector - Class Selector

A Class selector that selections nodes by targeting the class attribute. The shorthand Class selector names are: the class name preceded with a period. The same fully qualified is based on attribute...
Chrome Devtool Selector
Selector - Not

not is a logical pseudo-class that negates its expression. Its selects elements that are not represented by its arguments. Example of a selector when the element has the class fade but not the class...
Chrome Devtool Selector
Selector - Pseudo Class

A pseudo-class is a keyword added to operator that specifies a special state of the element to be selected. Logical Pseudo-class (:matches, :not, :has ) Tree Pseudo-class (:root, :empty, :blank,...
Chrome Devtool Selector
Selector API

API A selector is a boolean expression (known also as predicate) that match against elements in a DOM tree in order to select one or several node. This API was known before as the CSS and was renamed...
Chrome Devtool Selector
Selector is pseudo-class

:is() is a matches-any logical pseudo-class that takes a selector list as its argument. matches any element that is being hovered or focused, regardless of its namespace. represents only...

Share this page:
Follow us:
Task Runner