CSS Selector Level 4 » Scope pseudo-class

This pseudo-class is called scope pseudo-class and represents any element that is in the contextual reference element set. If the contextual reference element set is empty, :scope is equivalent to :root.

# Syntax

Copy
:scope {
    background-color: gray;
}

# Example

Copy
:scope {
    /* declarations */
}

In this example the :scope is equivalent to :root and will select the <html> element. The scoped style will be applied to its parent element (as reference) too.

Try example in CodePen

# Browser support

Platform Chrome Firefox Safari Edge Internet Explorer Opera
Desktop Yes (27) Yes (21) Yes (7) Yes (79) No Yes (15)
Mobile Yes (27) Yes (25) Yes (7) No No Yes (15)

# 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