Introduksjon til HTML-formelementer
I Web Development Technologies (spesielt for front-end) er "HTML" det grunnleggende eller primære merkespråket som vi bruker for å vise websidene (siden vi ser på et nettsted). Noen ganger, på en HTML-side, sammen med det andre innholdsdisplayet, må vi også ta noen brukerinnganger (spesielt på dynamiske nettsteder). Og for å ta brukerinngangene på en HTML-side, må vi bruke flere skjemaelementer for å lage disse skjemaene riktig, og ved hjelp av disse skjemaene tar vi brukerinngangene på en riktig måte og legger disse innspillene (dataene) i våre interne Databaser på baksiden. Som vi vet at HTML-koder er skrevet under forskjellige tagelementer () så er "HTML Form Elements" i utgangspunktet elementene som brukes i en "" tag. Og disse elementene sammen med andre standard og unike attributter gir en form og struktur i tillegg som lar brukerne vite hva de skal gjøre med skjemaet og hvordan de kan gå frem på en strukturell måte.
Forklar HTML-formelementer (inkludert syntaks og eksempler med utdata)
Siden det er flere HTML-skjemaelementer for å lage en form og gi formen et skikkelig utseende på en strukturert måte; nedenfor er noen av dem forklart en etter en.
| SL No. | Tags | Betydninger / beskrivelser |
|
1 | For å definere et HTML-skjema for brukerinnganger | |
|
2 | For å definere inngangskontroll | |
|
3 | For å spesifisere en liste med forhåndsdefinerte alternativer | |
|
4 | Å definere grupperelaterte elementer | |
|
5 | For å definere en sikker inngang | |
|
6 | Å definere en etikett med input | |
|
7 | For å definere en bildetekst for feltsett | |
|
8 |
For å definere en gruppe lignende alternativer |
|
|
9 |
For å definere et alternativ for rullegardinmenyen |
|
|
10 |
For å definere et resultat |
|
|
11 |
For å definere en liste over rullegardin |
|
|
12 |
For å definere et multiline inputområde |
Merk: De fleste av HTML-tagelementene som er diskutert her, er for HTML5, som er den siste versjonen av HTML-språk. Merkelementet støttes ikke lenger i HTML5; den ble faktisk brukt til den forrige versjonen av HTML.
Syntaks og eksempel
Noen syntakser og eksempler på HTML-formelementer med utganger blir diskutert nedenfor:
-
Elementet
Dette elementet kan inneholde mange andre elementer, inkludert følgende:
Eksempel på et element med inn- og send-knapp:
syntaks:
Your Name:
koder:
Your name:
Produksjon:
-
Elementet
Dette elementet er et inline-element og tilhører form-element-gruppen.
syntaks:
Input name:
Input age:
koder:
Input name:
Input age:
Produksjon:
-
Elementet
Det spesifiserer vanligvis en forhåndsdefinert liste over innganger for element der brukere kan velge et hvilket som helst alternativ fra den forhåndsdefinerte listen.
syntaks:
koder:
Produksjon:
-
Elementet
Dette elementet brukes i utgangspunktet til å gruppere relaterte elementer i former og tegner en boks rundt de lignende elementene.
syntaks:
Celebrity:
Name:
Phone:
Age:
koder:
Celebrity:
Name:
Phone:
Age:
Produksjon:
-
Elementet
Dette elementet kan lokalisere utenfor skjemaet, men det kan fortsatt være en del av skjemaet. Vanligvis brukes dette elementet til å spesifisere en eller flere former. Dette elementet er nylig brukt i HTML5-versjonen for å generere en krypteringsnøkkel for å overføre krypterte data over et skjema på et nettsted basert på HTML.
syntaks:
koder:
Username:
Det nedenfor nevnte keygenfeltet er utenfor skjemaet, men det er fortsatt en del av skjemaet ovenfor.
kryptering:
Produksjon:
-
Elementet
Dette elementet gir i utgangspunktet et navn på inndataformen for å få brukerne til å forstå hvilke inndata det skal være. Det fungerer som en indikator for brukere.
syntaks:
…
koder:
Example of HTML label tag
Boy
Girl
Produksjon:
-
Elementet
Dette elementet definerer faktisk en bildetekst for et element. Det er et slags støtteelement for et annet element, en del av gruppeelementet.
syntaks:
Celebrity:
Name:
Phone:
Age:
koder:
Example of HTML legend tag
Celebrity:
Name:
Phone:
Age:
Produksjon:
-
Elementet
Dette elementet er et grupperelatert element som brukes til alternativer i en rullegardinliste i en HTML-form. Det hjelper brukerne å håndtere en lang liste enkelt.
syntaks:
Ninja 300
Ninja 450
Pulsar 200
Pulsar 150
koder:
Example of HTML legend tag
Ninja 300
Ninja 450
Pulsar 200
Pulsar 150
Produksjon:
-
Elementet
Dette elementet brukes til å representere et alternativ fra en rullegardinliste under elementet; rullegardinlisten må inneholde minst ett alternativ.
syntaks:
…
koder:
Example of HTML option tag
Bikes
Cars
Buses
Produksjon:
-
Elementet
Dette elementet brukes i utgangspunktet for å vise utdataene fra en beregning (f.eks. I en skriptberegning).
syntaks:
…
koder:
Example of HTML output Tag
+
=
Produksjon:
-
Elementet
Dette elementet brukes til å gjøre et valg fra en liste i et skjema.
syntaks:
Bike
Car
Bus
koder:
Example of HTML select Tag
Bike
Car
Bus
Produksjon:
-
Elementet
Dette elementet brukes til å definere tekstlinjeinnganger på flere linjer (f.eks. For adresse).
syntaks:
Kommenter:
Sett her …
koder:
Example of HTML textarea Tag
Kommenter:
Sett her …
Produksjon:
Konklusjon
Det er så mange HTML-formelementer tilgjengelig; i denne artikkelen har vi diskutert noen av de grunnleggende eller innfødte HTML-skjemaelementene. HTML-skjemaelementer hjelper oss med å lage riktige og funksjonelle HTML-skjemaer. Det skal bemerkes at de fleste av HTML-skjemaelementene trenger noen få attributter som skal inkluderes sammen med dem. Noen av elementene er avhengige av hverandre som må kodes sammen. Elementene som allerede er utdatert, vises kanskje ikke av alle nettlesere.
Anbefalte artikler
Dette har vært en guide til HTML-formelementer. Her diskuterer vi innføring og elementer i form med syntaks og prøvekode. Du kan også gå gjennom andre foreslåtte artikler for å lære mer -
- Versjoner av HTML
- Fordeler med HTML
- Karriere i HTML
- HTML-blokker
- Gratis HTML-kurs
- HTML-rammer
- Angi en bakgrunnsfarge i HTML med eksempel