web-dev-qa-db-fra.com

Sélecteur CSS avec point dans l'ID

La spécification HTML autorise les points (.) Dans un identifiant:

<img id="some.id" />

Cependant, l'utilisation d'une règle de sélection d'ID CSS ne correspondra pas correctement:

#some.id { color: #f00; }

La spécification CSS pour ID Selectors ne mentionne pas ce cas. Je suppose donc qu'il utilise la combinaison d'un nom de balise et sélecteur de classe ? Par exemple, une règle CSS de a.className s'appliquerait à toutes les balises d'ancrage (<a>) avec un nom de classe className, comme <a class="className"></a>.

Est-il possible d'avoir une règle de fichier CSS externe qui référence un élément HTML par son identifiant qui contient un point?

Je m'attends à ce que non car la spécification CSS spécifie qu'un CSS " identifiant " n'inclut pas le point comme caractère valide. Est-ce donc un décalage fondamental entre les spécifications HTML et CSS? Ma seule alternative est-elle d'utiliser un autre type de sélection CSS? Quelqu'un peut-il être plus intelligent que moi pour le confirmer ou le nier?

(Je supprimerais le point de l'attribut id HTML pour simplifier les choses, mais c'est un identifiant généré par le système, donc je n'ai pas la possibilité de le changer dans ce cas.)

80
Jon Adams

Classique. Juste après avoir fouillé toutes les spécifications écrivant la question, je l'ai lue un peu plus et j'ai trouvé qu'il y avait un caractère d'échappement. Je n'en ai jamais eu besoin auparavant, mais la spécification CSS permet barre oblique inverse (\) d'échappement comme la plupart des langues. Qu'est-ce que tu sais?

Donc, dans mon exemple, la règle suivante correspondrait:

#some\.id { color: #f00; }

167
Jon Adams

Vous pouvez également utiliser img [id = some.id]]

Plus d'informations ici: http://www.w3.org/TR/selectors/#attribute-selectors

20
SDD512