Maison >interface Web >tutoriel CSS >Comment styliser les éléments CSS avec des deux-points dans leurs identifiants ?

Comment styliser les éléments CSS avec des deux-points dans leurs identifiants ?

DDD
DDDoriginal
2024-12-06 14:30:15315parcourir

How to Style CSS Elements with Colons in Their IDs?

Sélecteurs CSS : surmonter les deux-points dans les ID d'élément

Lorsque vous travaillez avec CSS, vous pouvez rencontrer des situations dans lesquelles vous devez styliser un élément avec un ID contenant un caractère deux-points ( :). Cependant, comme les deux points sont utilisés comme délimiteur de pseudo-éléments en CSS, cela peut entraîner des conflits.

Dans votre cas, JSF a défini l'ID d'un champ de saisie sur "search_form:expression". Pour spécifier le style de cet élément, vous êtes confronté à un problème avec les deux-points entraînant une interprétation incorrecte du sélecteur.

Solution : utiliser l'échappement avec barre oblique inverse

Pour échapper au deux points et assurez-vous qu'il est traité comme faisant partie de l'ID de l'élément, vous pouvez utiliser une barre oblique inverse () devant lui. Par exemple :

input#search_form\:expression {
  ///...
}

En ajoutant la barre oblique inverse, vous échappez efficacement aux deux points, l'empêchant d'être reconnu comme délimiteur de pseudo-éléments. Le navigateur l'interprétera ensuite correctement comme faisant partie de l'ID de l'élément.

Ressource supplémentaire :

  • [Utilisation d'espaces de noms avec CSS](https://msdn .microsoft.com/en-us/library/ms531194.aspx) (MSDN) fournit des informations supplémentaires à ce sujet sujet.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn