Comment simuler l'événement OnClick dans CSS

Un clic sur un élément déclenche l'événement onclick. Cet événement peut valider le formulaire, fournir des messages d'avertissement, et plus. Les cases à cocher dans CSS sont le meilleur moyen de simuler les événements OnClick. Cet article montre comment vous pouvez simuler l'événement OnClick à l'aide de CSS.

Comment simuler l'événement OnClick dans CSS?

Pour simuler une technique de case à cocher OnClick Event est utilisée. Avant d'aller de l'avant en premier, nous apprenons ce qu'est une case à cocher.

Qu'est-ce qu'une case à cocher dans CSS?

La case à cocher est une technique qui peut contrôler l'apparence de certains éléments, comme basculer la visibilité des onglets, les menus déroulants et bien d'autres.

Syntaxe

La syntaxe de la case à cocher est donnée ci-dessous:

: Il est utilisé pour prendre l'entrée de l'utilisateur.

identifiant: C'est le nom de la classe que nous avons attribuée.

Passons à l'exemple pratique dans lequel nous appliquerons l'événement OnClick sur une image.

Exemple: comment simuler l'événement onclick?

Ici, nous allons:

• • Créez une case à cocher à l'aide de la balise et attribuez l'ID "sur clic«À lui.
  • Écrivez une balise, identique à ID. Les deux devraient être les mêmes.
  • Insérez une image à l'aide de la balise:

Après cela, passez au CSS et écrivez le code suivant:

#OnClick: vérifié + étiquette> img
Largeur: 100px;
hauteur: 75px;

Dans le code susmentionné, nous avons mis en œuvre:

• • UN ":vérifié"Sélecteur dans la classe nommée"sur clic".
  • Nous avons sélectionné une image à l'intérieur de l'étiquette en utilisant l'opérateur +.
  • À l'étape suivante, nous avons attribué la hauteur et la largeur de l'image.

Il nous donnera la sortie suivante:

La sortie a vérifié que l'événement OnClick a été appliqué à l'image avec succès.

Conclusion

Dans CSS, nous pouvons simuler l'événement OnClick en utilisant la case à cocher. Pour ce faire, ajoutez une case à cocher à l'aide de la balise et attribuez un "identifiant«À lui. Ensuite, créez une balise et attribuez-lui une valeur identique à "identifiant". Dans le fichier CSS, ajoutez un ":vérifié”Sélecteur dans la classe ciblée et sélectionnez l'image à l'intérieur de l'étiquette à l'aide de l'opérateur +. Cet article a expliqué comment simuler l'événement onclick en utilisant CSS, ainsi que ses exemples.