Maison >interface Web >tutoriel CSS >Pouvez-vous utiliser des valeurs d'attribut comme sélecteurs CSS ?

Pouvez-vous utiliser des valeurs d'attribut comme sélecteurs CSS ?

Linda Hamilton
Linda Hamiltonoriginal
2024-11-03 20:06:03764parcourir

Can You Use Attribute Values as CSS Selectors?

Les valeurs d'attribut peuvent-elles être utilisées comme sélecteurs CSS ?

La mise à jour dynamique du CSS en fonction des valeurs d'entrée est une exigence courante dans le développement Web. Les navigateurs ne prennent pas automatiquement en charge cette fonctionnalité, car les sélecteurs CSS ciblent généralement les attributs statiques.

Valeurs dynamiques

Comme expliqué, les règles CSS simples ciblent les valeurs d'attribut, et non les valeurs réelles. Pour les mises à jour dynamiques, JavaScript peut être utilisé pour manipuler le CSS en fonction des valeurs d'entrée.

Réponse originale

Cependant, le ciblage de valeurs statiques est toujours possible à l'aide des sélecteurs d'attributs CSS :

<code class="css">input[value="United States"] { color: #F90; }</code>

Ce sélecteur cible les entrées avec un attribut de valeur « États-Unis » et définit la couleur du texte sur rouge.

Sélecteurs d'attributs CSS

Les sélecteurs d'attributs CSS font référence aux attributs d'entrée des manières suivantes :

  • [attr] - Fait correspondre les éléments avec un attribut "attr" défini, quelle que soit la valeur.
  • [attr=val] - Fait correspondre les éléments avec une valeur d'attribut "attr" égale à " val".
  • [attr~=val] - Correspond aux éléments avec une valeur d'attribut "attr" contenant "val".
  • [attr|=val] - Correspond aux éléments avec un "attr" valeur d'attribut égale à "val" ou commençant par "val-".

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