Maison > interface Web > tutoriel CSS > Comment puis-je styliser les étiquettes des boutons radio cochés en utilisant CSS ?

Comment puis-je styliser les étiquettes des boutons radio cochés en utilisant CSS ?

Linda Hamilton
Libérer: 2024-12-21 08:19:13
original
290 Les gens l'ont consulté

How can I style labels of checked radio buttons using CSS?

Style des étiquettes des boutons radio cochés avec CSS

La tâche d'appliquer des styles CSS aux étiquettes associées aux boutons radio cochés peut être accomplie en utilisant le Sélecteur CSS 'input[type="radio"] : coché label`.

Explication :

Le symbole ` dans ce sélecteur représente le **Combinateur frère/sœur adjacent**. Il garantit que l'étiquette apparaît immédiatement après la saisie du bouton radio coché. En combinant ce sélecteur avec la pseudo-classe :checked`, il cible les étiquettes qui suivent les entrées des boutons radio cochés.

Par exemple, considérons le balisage suivant :

<input>
Copier après la connexion

Utilisation du sélecteur ` input[type="radio"]:checked label, vous pouvez appliquer le style suivant :

input[type="radio"]:checked+label {
  font-weight: bold;
}
Copier après la connexion

Ce style fera l'étiquette du bouton radio coché gras, tout en laissant inchangées les étiquettes des boutons radio non cochés.

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