:scope

This translation is incomplete. Please help translate this article from English.

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

Sumari

La pseudo-classe :scope CSS coincideix amb els elements que són un punt de referència per als selectors que es corresponguin amb. En HTML, es pot definir un nou punt de referència mitjançant l'atribut scoped de <style>. Si no s'empra aquest atribut en una pàgina HTML, el punt de referència és l'element <html>.

Sintaxi

:scope { style properties }

Exemple

<article>
  The element selected by :scope has a lime background if your browser supports scoped stylesheet.
  <section> 
    <p>Outside scope.</p>
  </section>
  <section>
    <style scoped>
      :scope { background-color: lime; }
    </style>
    <p>Inside scope.</p>
  </section>
  <section> 
    <p>Outside scope.</p>
  </section>
</article>

Resultat

Especificacions

Especificació Estat Comentari
Selectors Level 4
The definition of ':scope' in that specification.		 Working Draft Definició inicial.

Navegadors compatibles

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suport bàsic(static profile - stylesheets) (Yes)[1] (Yes)[2] No support 15[1] 7.0[1]
En .querySelector/.querySelectorAll (Yes) 32 No support 15[1] 7.0
Característica Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport bàsic (static profile - stylesheets) ? (Yes)[2] No support No support 7.0
En .querySelector/.querySelectorAll ? 32 No support No support 7.0

[1] Encara que Chrome i Safari identifican una coincidencia de la pseudo-classe, i per tant apliquen la regla CSS, no sent compatible en el seu propi ambit d'estil, com a conseqüència la regla CSS aplicada inunda més enllà de la part prevista del document. És, per tant, igual d'efectiva i funcional que :root.

[2] Gecko 20 (Firefox 20) i posterior implementa la pseudo-classe :scope, però la preferència layout.css.scope-pseudo.enabled ha de tenir el valor true. Només està habilitat per defecte en les versions de prova Nightly i Aurora des de Gecko 32 (Firefox 32).

Veure

Document Tags and Contributors

Tags: 
 Contributors to this page: Legioinvicta
 Last updated by: Legioinvicta,