We're looking for a person or people to help audit MDN to find places we could speed up. Is this you or someone you know? Check out the RFP: https://mzl.la/2IHcMiE

Nuestros voluntarios aún no han traducido este artículo al Español. ¡Únete a nosotros y ayúdanos a traducirlo!
También puedes leer el artículo en English (US).

The :scope CSS pseudo-class represents elements that are a reference point for selectors to match against.

/* Selects a scoped element */
:scope {
  background-color: lime;

Currently, when used in a stylesheet, :scope is the same as :root, since there is not at this time a way to explicitly establish a scoped element. When used from a DOM API such as querySelector(), querySelectorAll(), matches(), or Element.closest(), :scope matches the element you called the method on.




In this simple example, we demonstrate that using the :scope pseudo-class from the Element.matches() method matches the element on which it's called.


let paragraph = document.getElementById("para");
let output = document.getElementById("output");

if (paragraph.matches(":scope")) {
  output.innerText = "Yep, the element is its own scope as expected!";


<p id="para">
  This is a paragraph. It is not an interesting paragraph. Sorry about that.
<p id="output"></p>



Specification Status Comment
Selectors Level 4
The definition of ':scope' in that specification.
Working Draft Initial definition.

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support No No



Support in DOM API such as in querySelector() and querySelectorAll()27 No32 No157
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support No ? ?



No7 ?
Support in DOM API such as in querySelector() and querySelectorAll()27 ? ?32 No7 ?

1. From version 20: this feature is behind the layout.css.scope-pseudo.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

See also

Etiquetas y colaboradores del documento

 Última actualización por: mfuji09,