Règles @

Une règle @ est une expression CSS commençant par le symbole '@' (U+0040 COMMERCIAL AT), suivie d'un identifiant et qui contient tout ce qui se trouve jusqu'au prochain point-virgule, ';' (U+003B SEMICOLON), ou jusqu'au prochain bloc CSS trouvé en premier.

Il existe de nombreuses règles @, désignées par leur identifiants, chacune ayant leur propre syntaxe :

  • @charset qui définit le jeu de caractères utilisé par la feuille de style.
  • @import qui indique au moteur de rendu d'inclure une feuille de style externe.
  • @namespace qui indique au motteur de rendu que le contenu doit être pris en compte comme s'il était préfixé pour un espace de noms XML.
  • Les règles @ imbriquées. Ces règles sont un sous-ensemble des instructions imbriquées qui peuvent être utilisées au plus haut niveau de la feuille de style et aussi à l'intérieur de règles conditionnelles :
    • @media : une règle de groupe conditionnelle qui applique son contenu si l'appareil utilisé respecte les critères définis dans la « requête média » (ou media query).
    • @supports  : une règle de groupe conditionnelle qui applique son contenu si le navigateur respecte une condition donnée (par exemple, si le navigateur supporte tel élément de syntaxe).
    • @document : une règle de groupe conditionnelle qui applique son contenu si le document sur lequel s'applique la feuille de style respecte une condition donnée (cette règle a été reportée pour être incluse dans la spécification CSS de niveau 4)
    • @page : une règle qui décrit les modifications de disposition à appliquer lorsque le document doit être imprimé/paginé.
    • @font-face : une règle qui définit une police externe à télécharger.
    • @keyframes : une règle qui décrit les états des différentes étapes intermédiaires qui composent une animation CSS.
    • @viewport : une règle de groupe conditionnelle qui applique son contenu selon des critères relatifs à la zone d'affichage (viewport) (cette règle est au stade du brouillon de travail).
    • @counter-style : une règle qui permet de définir des styles de compteur spécifiques qui ne font pas partie des styles prédéfinis.
    • @font-feature-values (ainsi que @swash, @ornaments, @annotation, @stylistic, @styleset et @character-variant) : ces règles permettent de définir des noms d'usages pour la propriété font-variant-alternates qui permet d'activer différentes caractéristiques des polices OpenType.

Les règles de groupe conditionnelles

Comme pour les différentes propriétés, chaque règle @ possède une syntaxe différente. Toutefois, on peut en regrouper certaines dans une catégorie : les règles de groupe conditionnelles. Ces instructions partagent une syntaxe commune et permettent d'inclure des instructions imbriquées (soit des ensembles de règles CSS soit des règles @ imbriquées). De plus, elles portent toutes une sémantique commune : toutes définissent une certaine condition qui, selon qu'elle est évaluée à vrai ou à faux, permettre d'appliquer les instructions imbriquées du groupe.

Les règles de groupe conditionnelles définies par la spécification de niveau 3 sur les règles CSS conditionnelles sont :

Chaque groupe conditionnel peut également contenir des instructions imbriquées. Il peut donc y avoir un nombre indéterminé de niveaux d'imbrication.

Spécifications

Spécification État Définition
CSS Conditional Rules Module Level 3 Candidat au statut de recommandation Définition initiale.
Web Compatibility Standard
La définition de 'CSS At-rules' dans cette spécification.
Standard évolutif Standardisation de @-webkit-keyframes.

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight, Chealer, teoli, naar, FredB
 Dernière mise à jour par : SphinxKnight,