Pseudo Classe CSS :scope
La pseudo-classe CSS :scope représente les éléments qui sont un point de référence pour faire correspondre les sélecteurs.
Le :scope est le même que :root, car il n'existe pas de moyen pour identifier un élément dont la portée est restreinte.
L'élément scope est un élément qui forme un contenu pour un bloc de styles.
Version
Selectors Level 4
Syntaxe
:scope {
css declarations;
}Exemple
<!DOCTYPE html>
<html>
<head>
<title>Titre du document</title>
<style>
.container {
margin: 40px auto;
max-width: 700px;
background-color: #eeeeee;
padding: 20px;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
}
section {
padding: 30px;
}
:scope {
background-color: #1c87c9;
}
</style>
</head>
<body>
<h2>Exemple du sélecteur :scope</h2>
<div class="container">
<section>
<p>
Dans le scope.
</p>
</section>
<p>
Hors de scope.
</p>
</div>
</body>
</html>Support de Navigateurs
|
|
|
|
|
|---|---|---|---|---|
| 27.0+ | ✕ | 32.0+ | 7.0+ | 15.0+ |
Pratiquez vos connaissances
Selon le site www.w3docs.com, quelles sont les affirmations correctes concernant l'application de CSS aux documents HTML?
Correcte!
Incorrecte!