Comment styliser des éléments avec des noms de classe CSS commençant par des nombres ?

Noms de classe CSS commençant par des chiffres : une solution de contournement

Malgré la grammaire CSS interdisant l'utilisation de noms de classe commençant par des nombres, il existe des cas où de tels noms de classe existent dans les documents HTML. Cet article explore une solution de contournement pour rendre ces noms valides en CSS.

Aperçu du problème

Selon la syntaxe CSS, un identifiant ne peut pas commencer par un chiffre non échappé. Les classes commençant par des chiffres, telles que « .000000-8 », ne sont donc pas valides.

Solution de contournement

La solution de contournement pour rendre valides les classes CSS dont les noms commencent par des chiffres implique d'échapper les chiffres.

En utilisant la séquence d'échappement CSS "", le chiffre peut être converti en caractère d'échappement. Par exemple, le nom de classe « .000000-8 » peut être exprimé comme suit :

<code class="css">. 00000-8 {background:url(../../images/common/000000-0.8.png);}</code>

ou

<code class="css">.<pre class="brush:php;toolbar:false"><code class="css">. 00000-8 { ... }</code>

Exemple d'utilisation

Pour utiliser le caractère d'échappement dans un sélecteur CSS, préfixez simplement le premier chiffre avec la séquence d'échappement. Par exemple, le sélecteur suivant correspondrait à un élément de la classe « 000000-8 » :

Considérations pratiques

Bien que cette solution de contournement résolve le problème technique, il n'est généralement pas conseillé d'utiliser des noms de classe commençant par des chiffres. Cela peut prêter à confusion et rendre difficile la maintenance du code. Si possible, il est préférable d'utiliser des noms de classe alphanumériques sans premiers chiffres.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!