CSS Selector Level 4 » Matches-any pseudo-class

This pseudo-class is called matches-any pseudo-class and takes a selector list as argument. It lets you create sets of selectors by instituting groups which match all included selectors. Other pseudo-elements can't be represented with this pseudo-class, so e.g. negations may not be nested like this invalid example: E:is(:is(F)). Please note this selector was previously named :matches().

# Syntax

Copy
:is(selector1[, selector2,]) {
    /* declarations */
}

# Example

Copy
section h1, article h1, aside h1 {
    color: red;
}

/* Is the same as */

:is(section, article, aside) h1 {
    color: red;
}

/* Working, prefixed examples. Note: Mozilla and WebKit uses their own syntax :-prefix-any */
:-moz-any(section, article, aside) h1,
:-webkit-any(section, article, aside) h1{
    color: red;
}

This example will select all h1 headings which are children of section, article, aside grouped by the :is selector.

Try example in CodePen

# Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop Yes (12) Yes (4) Yes (5.1) Yes (88) No Yes (15)
Mobile Yes (59) Yes (54) Yes (5) Yes (88) No Yes (37)

# Usage statistics (Alexa Top 1,250,000 sites)

Due to an extreme price increase of our statistics provider the data collection was stopped in September 2018.


Please wait a moment, the comments start loading now...
explorermozillachromesafariopera info external