Introduktion till HTML-formelement
I webbutvecklingsteknologier (speciellt för front-end) är "HTML" det grundläggande eller primära markeringsspråket som vi använder för att visa webbsidorna (sidan som vi ser på en webbplats). Ibland, på en HTML-sida, tillsammans med det andra innehållsskärmen, måste vi ta vissa användarinsatser också (särskilt på dynamiska webbplatser). Och för att ta användarinmatningarna på en HTML-sida, måste vi använda flera formelement för att skapa dessa formulär ordentligt och med hjälp av dessa formulär tar vi användaringångarna på ett korrekt sätt och lägger dessa input (data) i våra interna Databaser på baksidan. Som vi vet att HTML-koder skrivs under olika tagelement () så är "HTML-formelement" i princip de element som används i en "" -tagg. Och dessa element tillsammans med andra standard- och unika attribut ger en form och struktur som också låter användarna veta vad de ska göra med formuläret och hur man går framåt på ett strukturellt sätt.
Förklara HTML-formelement (inklusive syntax och exempel med utgång)
Eftersom det finns flera HTML-formelement för att skapa en form & ge formen ett ordentligt utseende på ett strukturerat sätt; nedan är några av dem förklarade en efter en.
| SL Nej. | Tags | Betydelser / beskrivningar |
|
1 | För att definiera en HTML-form för användaringångar | |
|
2 | För att definiera ingångskontroll | |
|
3 | För att ange en lista med fördefinierade alternativ | |
|
4 | För att definiera grupprelaterade element | |
|
5 | För att definiera en säker ingång | |
|
6 | För att definiera en inmatningsetikett | |
|
7 | För att definiera en bildtext för fältuppsättning | |
|
8 |
För att definiera en grupp liknande alternativ |
|
|
9 |
Definiera ett alternativ för rullgardinsmenyn |
|
|
10 |
För att definiera ett resultat |
|
|
11 |
Definiera en lista med listrutor |
|
|
12 |
För att definiera ett multiline inmatningsområde |
Obs: De flesta HTML-tagelement som diskuteras här är för HTML5, som är den senaste versionen av HTML-språk. Taggelementet stöds inte längre i HTML5; det användes faktiskt för den tidigare versionen av HTML.
Syntax och exempel
Vissa syntaxer och exempel på HTML-formelement med utgångar diskuteras nedan:
-
"" Element
Detta element kan innehålla många andra element också inklusive nedan:
Exempel för ett "" element med in- och skicka-knappen:
Syntax:
Your Name:
koder:
Your name:
Produktion:
-
"" Element
Detta element är ett inlineelement och tillhör formelementgruppen.
Syntax:
Input name:
Input age:
koder:
Input name:
Input age:
Produktion:
-
"" Element
Det anger vanligtvis en fördefinierad lista över ingångar för element där användare kan välja valfritt alternativ från den fördefinierade listan.
Syntax:
koder:
Produktion:
-
"" Element
Detta element används i princip för att gruppera relaterade element i former och drar en ruta runt liknande element.
Syntax:
Celebrity:
Name:
Phone:
Age:
koder:
Celebrity:
Name:
Phone:
Age:
Produktion:
-
"" Element
Det här elementet kan hitta utanför formuläret men ändå, det kan vara en del av formuläret. Vanligtvis används detta element för att specificera en eller flera former. Detta element används nyligen i HTML5-versionen för att generera en krypteringsnyckel för att skicka krypterad data över en form på en webbplats baserad på HTML.
Syntax:
koder:
Username:
Nedan nämnda keygen-fält är utanför formen, men det är fortfarande en del av ovanstående form.
kryptering:Produktion:
-
"" Element
Detta element ger i princip ett namn på inmatningsformuläret så att användarna förstår vilken inmatningsdata det ska vara. Det fungerar som en indikator för användare.
Syntax:
…
koder:
Example of HTML label tag
Boy
Girl
Produktion:
-
"" Element
Detta element definierar faktiskt ett bildtexter för ett element. Det är typ av ett stödelement för ett annat element, en del av gruppelementet.
Syntax:
Celebrity:
Name:
Phone:
Age:
koder:
Example of HTML legend tag
Celebrity:
Name:
Phone:
Age:
Produktion:
-
"" Element
Detta element är ett grupprelaterat element som används för alternativ i en listruta i en HTML-form. Det hjälper användarna att hantera en lång lista enkelt.
Syntax:
Ninja 300
Ninja 450
Pulsar 200
Pulsar 150
koder:
Example of HTML legend tag
Ninja 300
Ninja 450
Pulsar 200
Pulsar 150
Produktion:
-
"" Element
Detta element används för att representera ett alternativ från en rullgardinslista under element; rullgardinslistan måste innehålla minst ett alternativ.
Syntax:
…
koder:
Example of HTML option tag
Bikes
Cars
Buses
Produktion:
-
"" Element
Detta element används i princip för att visa utfallet från en beräkning (t.ex. i en skriptberäkning).
Syntax:
…
koder:
Example of HTML output Tag
+
=
Produktion:
-
"" Element
Detta element används för att göra ett urval från en lista i ett formulär.
Syntax:
Bike
Car
Bus
koder:
Example of HTML select Tag
Bike
Car
Bus
Produktion:
-
"" Element
Detta element används för att definiera flerstreckade textingångar (t.ex. för adress).
Syntax:
Lägg din kommentar:
Lägg här…
koder:
Example of HTML textarea Tag
Lägg din kommentar:
Lägg här…
Produktion:
Slutsats
Det finns så många HTML-formelement tillgängliga; i den här artikeln har vi diskuterat några av de grundläggande eller ursprungliga HTML-formelementen. HTML-formelement hjälper oss att skapa korrekta och funktionella HTML-formulär. Det är viktigt att notera att de flesta HTML-formelement behöver några attribut för att inkluderas tillsammans med dem. Vissa av elementen är beroende av varandra som måste kodas tillsammans. Elementen som redan har utgått kanske inte visas av alla webbläsare.
Rekommenderade artiklar
Detta har varit en guide till HTML-formelement. Här diskuterar vi introduktionen och elementen i form med syntax och provkod. Du kan också gå igenom våra andra föreslagna artiklar för att lära dig mer -
- Versioner av Html
- Fördelar med HTML
- Karriär i HTML
- HTML-block
- Gratis HTML-kurs
- HTML-ramar
- Ställ in en bakgrundsfärg i HTML med exempel