Hvordan simulere onClick -hendelsen i CSS
Et klikk på et element utløser OnClick -hendelsen. Denne hendelsen kan validere skjemaet, gi advarselsmeldinger og mer. KrysBokser i CSS er den beste måten å simulere OnClick -hendelser. Denne artikkelen demonstrerer hvordan du kan simulere OnClick -hendelsen ved hjelp av CSS.
Hvordan simulere onClick -arrangement i CSS?
For å simulere en OnClick Event avkrysningsrute -teknikk brukes. Før vi går fremover først, lærer vi hva en avkrysningsrute er.
Hva er en avkrysningsrute i CSS?
Avkrysningsruten er en teknikk som kan kontrollere utseendet til visse elementer, som å slå synligheten til faner, rullegardinmenyer og mange flere.
Syntaks
Syntaks for avkrysningsruten er gitt nedenfor:
: Det brukes til å ta innspill fra brukeren.
id: Det er navnet på klassen vi har tildelt.
La oss flytte til det praktiske eksemplet der vi vil bruke OnClick -hendelsen på et bilde.
Eksempel: Hvordan simulere OnClick -hendelsen?
Her vil vi:
-
- Opprett en avkrysningsrute ved hjelp av tag og tilordne ID “ved trykk”Til det.
- Skriv en tag, samme som ID. Begge skal være de samme.
- Sett inn et bilde ved hjelp av tag:
Etter det, flytt til CSS og skriv følgende kode:
#onclick: sjekket + etikett> img
Bredde: 100px;
Høyde: 75px;
I den ovennevnte koden har vi implementert:
-
- En ":krysset av”Valg i klassen som heter“ved trykk”.
- Vi har valgt et bilde inne i etiketten ved å bruke + -operatøren.
- I neste trinn har vi tildelt bildens høyde og bredde.
Det vil gi oss følgende utdata:
Output bekreftet at OnClick -hendelsen er brukt på bildet med hell.
Konklusjon
I CSS kan vi simulere OnClick -hendelsen ved å bruke avkrysningsruten. For å gjøre det, legg til en avkrysningsrute ved hjelp av tag og tilordne en “id”Til det. Neste, lag en tag, og tilordne den en verdi som "id”. I CSS -filen, legg til en ":krysset av”Valg i målklassen og velg bildet inne i etiketten ved hjelp av + -operatøren. Denne artikkelen forklarte hvordan du simulerer OnClick -hendelsen ved hjelp av CSS, sammen med eksemplene.