Que signifie le .container.\31 25\25 en CSS ?

En CSS, les identifiants peuvent contenir des caractères spéciaux, tels que la barre oblique inverse (). Le caractère barre oblique inverse sert à différentes fins en CSS, selon le contexte.

Caractères d'échappement

Dans une chaîne, une barre oblique inverse suivie d'une nouvelle ligne est ignorée. En dehors d'une chaîne, une barre oblique inverse suivie d'une nouvelle ligne se représente elle-même.

Échapper aux caractères spéciaux

Une barre oblique inverse peut être utilisée pour échapper aux caractères CSS spéciaux, leur faisant perdre leur caractère spécial. signification. Par exemple, un guillemet double ("") dans une chaîne peut être échappé sous la forme \".

Références de caractères Unicode

Une barre oblique inverse suivie de jusqu'à six chiffres hexadécimaux ( 0-9a-fA-F) représente le caractère ISO 10646 avec ce numéro. Un espace blanc ou un chiffre hexadécimal supplémentaire est utilisé pour terminer la référence.

Dans le code donné, la barre oblique inverse () est utilisée pour représenter une valeur en pourcentage dans le nom de classe de l'élément .container :

.container.\31 25\25 { /* 125% */
  width: 100%;
}

Les caractères spéciaux \31, 25 et \25 représentent respectivement les nombres hexadécimaux pour les caractères "1", "%" et "%". Ce code est donc équivalent à :

.container[class ~= "125%"] { /* 125% */
  width: 100%;
}

Ce sélecteur de classe correspond à n'importe quel élément avec une classe contenant "125%". Le calcul de la largeur de l'élément est le suivant :

width = (containers * 125%)