Maison > interface Web > tutoriel CSS > Comment puis-je styliser les étiquettes des cases à cocher sans JavaScript ?

Comment puis-je styliser les étiquettes des cases à cocher sans JavaScript ?

Linda Hamilton
Libérer: 2024-11-26 13:25:11
original
986 Les gens l'ont consulté

How Can I Style Checked Checkbox Labels Without JavaScript?

Mise en surbrillance des étiquettes pour les cases cochées sans JavaScript

Pouvez-vous modifier l'apparence d'une étiquette lorsque sa case associée est cochée à l'aide de méthodes autres que JavaScript ?

Solution :

Utiliser le adjacent combinateur frère/sœur en CSS :

.check-with-label:checked + .label-for-check {
  font-weight: bold;
}
Copier après la connexion

Ce code permet de mettre en évidence les étiquettes associées aux cases cochées. Voici un exemple de balisage HTML qui exploite cette approche :

<div>
  <input type="checkbox" class="check-with-label">
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal