@document

La règle @ @document permet d'appliquer des règles à un document en fonction de son URL. Elle est principalement conçue pour être utilisée dans les feuilles de style utilisateur. Une règle @document peut définir une ou plusieurs fonctions de correspondance ; si une de ces fonctions s'applique à l'URL du document, les règles correspondantes s'appliqueront.

Les fonctions disponibles pour cette règles sont :

• url() qui permettra d'obtenir une correspondance avec une URL exacte
• url-prefix() qui permettra d'obtenir une correspondance si l'URL du document commence avec la valeur fournie
• domain() qui permettra d'obtenir une correspondance si l'URL du document appartient au domaine indiqué ou à un de ses sous-domaines
• regexp() qui permettra d'obtenir une correspondance si l'URL  du document correspond à une expression rationnelle. L'expression doit correspondre à l'URL entière.

Syntaxe

Les valeurs fournies aux fonctions url(), url-prefix() et domain() peuvent éventuellement être délimitées par des quotes (simples ou doubles). Les valeurs fournies à la fonction regexp() doivent être délimitées par des quotes.

Pour l'échappement des valeurs dans la fonction regexp(), il faut également rajouter un niveau d'échappement pour le CSS. Ainsi, dans les expressions rationnelles, un point « . » correspond à n'importe quel caractère. Pour utiliser une correspondance avec un point dans une URL, il faudra d'abord l'échapper au sens de l'expression rationnelle avec une barre oblique inversée « \. » puis l'échapper pour CSS avec une deuxième barre oblique inversée « \\. ».

Syntaxe formelle

@document [ <url> | url-prefix(<string>) | domain(<string>) | regexp(<string>) ]# {
  <group-rule-body>
}

Exemples

@document url(https://www.w3.org/),
               url-prefix(https://www.w3.org/Style/),
               domain(mozilla.org),
               regexp("https:.*")
{
  /* Les règles CSS qui suivent s'appliquent à :
     - La page "https://www.w3.org/".
     - Toute page dont l'URL commence par "https://www.w3.org/Style/"
     - Toute page dont l'hôte de l'URL est "mozilla.org" 
       ou finit par ".mozilla.org"
     - Toute page dont l'URL commence par "https:" */

  /* Et là, on rend ces pages vraiment moches :) */
  body {
    color: purple;
    background: yellow;
  }
}

Spécifications

Cette règle @ fut initialement proposée pour la spécification CSS Conditional Rules Module Level 3 et fut repoussée afin d'être traitée par la spécification de niveau 4.

Compatibilité des navigateurs

Voir aussi

• Gérer des feuilles de style utilisateur par site, une discussion sur la liste de diffusion www-style.
• Le fichier userContent.css qui est la feuille de style destinée aux utilisateurs des navigateurs basés sur Gecko