Inngangsfeltet brukes til å lage skjemaer og ta innspill fra brukeren. Brukere kan fylle inngangsfeltet i henhold til inngangstypen. Men noen ganger må du deaktivere inngangsfeltet for å oppfylle enhver forutsetning, for eksempel å velge en avkrysningsrute. I den situasjonen må du deaktivere inngangsfeltet.

I denne guiden vil vi få en forståelse av hvordan du deaktiverer inngangsfeltet ved hjelp av CSS. Så la oss begynne!

Hvordan deaktivere et inngangsfelt ved hjelp av CSS?

I CSS er hendelser deaktivert ved å bruke “peker-hendelser”Eiendom. Så først, lær om pekerhendelsesegenskapen.

Hva er "Pointer-Events" CSS-eiendom?

“peker-hendelser”Kontroller hvordan HTML -elementene reagerer eller oppfører seg på berøringshendelsen, for eksempel å klikke eller trykke på hendelser, aktive eller sveve stater, og om markøren er synlig eller ikke.

Syntaks
Syntaksen til pekerhendelser er gitt som følger:

Peker-hendelser: Auto | Ingen;

Ovennevnte egenskap tar to verdier, for eksempel “bil”Og“ingen”:

• Auto: Det brukes til å utføre standardhendelser.
• ingen: Det brukes til å deaktivere hendelser.

Ta turen mot det gitte eksemplet.

Eksempel 1: Legge til et inngangsfelt ved hjelp av CSS

I dette eksemplet vil vi for det første lage en div og legge til et overskrift og inngangsfelt til det. Sett deretter inngangstypen som "tekst”Og setter verdien som“Skriv inn navnet ditt”.

Html

Deaktiver et inngangsfelt

Etter det, flytt til CSS og stil Div ved å sette bakgrunnsfarge som “RGB (184, 146, 99)”Og høyde som“150px”.

CSS

div
bakgrunnsfarge: RGB (184, 146, 99);
Høyde: 150px;

Utgangen fra ovennevnte kode er gitt nedenfor. Her kan vi se at inputfeltet vårt for øyeblikket er aktivt og godtar inngangen fra brukeren:

Gå nå til neste del der vi bruker verdien av "peker-hendelser”Eiendom som“ingen”.

Eksempel 2: Deaktivering av et inngangsfelt ved hjelp av CSS

Vi vil nå bruke “inngang”For å få tilgang til elementet som er lagt til i HTML-filen og angi verdien av peker-hendelser som“ingen”:

input
Peker-hendelser: Ingen;

Når du implementerer ovennevnte eiendom "peker-hendelser”Med“ingenVerdien, teksten til inngangsfeltet vil være ikke-redigerbar, noe som indikerer at inputfeltet vårt er deaktivert:

Det er det! Vi har forklart metoden for å deaktivere inngangsfeltet ved hjelp av CSS.

Konklusjon

For å deaktivere et inngangsfelt i en HTML, "peker-hendelser”Eiendom til CSS brukes. For å gjøre det, legg til et inngangsfelt, og angi verdien av pekerhendelser som “ingen”For å deaktivere inngangsfeltet. I denne guiden forklarer vi metoden for å deaktivere et inngangsfelt ved hjelp av CSS og gi et eksempel på det.