Inleiding tot HTML-formulierelementen

In Web Development Technologies (vooral voor de front-end) is 'HTML' de basis- of primaire opmaaktaal die we gebruiken om de webpagina's weer te geven (de pagina die we op een website zien). Soms moeten we op een HTML-pagina, samen met de andere inhoudsweergave, ook enkele gebruikersinvoer gebruiken (vooral in dynamische websites). En om de gebruikersinvoer op een HTML-pagina te nemen, moeten we meerdere formulierelementen gebruiken om die formulieren correct te maken en met behulp van die formulieren nemen we de gebruikersinvoer op een correcte manier en plaatsen we die invoer (gegevens) in onze interne Databases aan de achterkant. Omdat we weten dat HTML-codes onder verschillende tag-elementen worden geschreven (), zijn "HTML-formulierelementen" in feite die elementen die in een "" -tag worden gebruikt. En deze elementen geven samen met andere standaard- en unieke attributen ook een vorm en structuur die de gebruikers laten weten wat ze met de vorm moeten doen en hoe ze op een structurele manier te werk kunnen gaan.

Uitleg HTML-formulierelementen (inclusief syntaxis en voorbeelden met uitvoer)

Omdat er meerdere HTML-formulierelementen zijn om een ​​formulier te maken en het formulier op een gestructureerde manier een goed uiterlijk te geven; hieronder worden enkele daarvan één voor één uitgelegd.

SL Nee.TagsBetekenissen / beschrijvingen

1

Een HTML-formulier definiëren voor gebruikersinvoer

2

Om invoerbesturing te definiëren

3

Een lijst met vooraf gedefinieerde opties opgeven

4

Groepgerelateerde elementen definiëren

5

Een beveiligde invoer definiëren

6

Een invoerlabel definiëren

7

Een bijschrift voor veldset definiëren

8

Een groep vergelijkbare opties definiëren

9

Een optie voor de vervolgkeuzelijst definiëren

10

Om een ​​resultaat te definiëren

11

Een lijst met vervolgkeuzelijsten definiëren

12

Een invoergebied met meerdere regels definiëren

Opmerking: de meeste HTML-tag-elementen die hier worden besproken, zijn voor HTML5, de nieuwste versie van HTML-taal. Het tag-element wordt niet langer ondersteund in HTML5; het werd eigenlijk gebruikt voor de vorige versie van HTML.

Syntaxis en voorbeeld

Enkele syntaxis en voorbeelden van HTML-formulierelementen met uitvoer worden hieronder besproken:

  1. "" Element

Dit element kan ook veel andere elementen bevatten, waaronder het volgende:

    Voorbeeld voor een "" -element met invoer- en verzendknop:

    Syntaxis:


    Your Name:

    codes:



    Your name:


    Output:

    1. "" Element

    Dit element is een inline-element en behoort tot de vorm-elementgroep.

    Syntaxis:


    Input name:
    Input age:

    codes:



    Input name:
    Input age:


    Output:

    1. "" Element

    Het specificeert meestal een vooraf gedefinieerde lijst van ingangen voor elementen waar gebruikers een optie uit de vooraf gedefinieerde lijst kunnen kiezen.

    Syntaxis:





    codes:









    Output:

    1. "" Element

    Dit element wordt in principe gebruikt om gerelateerde elementen in formulieren te groeperen en tekent een kader rond de vergelijkbare elementen.

    Syntaxis:


    Celebrity:
    Name:
    Phone:
    Age:

    codes:




    Celebrity:
    Name:
    Phone:
    Age:

    Output:

    1. "" Element

    Dit element kan zich buiten het formulier bevinden, maar toch kan het een onderdeel van het formulier zijn. Gewoonlijk wordt dit element gebruikt om een ​​of meer vormen op te geven. Dit element wordt nieuw gebruikt in de HTML5-versie om een ​​coderingssleutel te genereren om gecodeerde gegevens door te geven aan een formulier in een website op basis van HTML.

    Syntaxis:

    codes:



    Username:

    Het hieronder genoemde keygenveld valt buiten de vorm, maar maakt nog steeds deel uit van de bovenstaande vorm.

    encryptie:

    Output:

    1. "" Element

    Dit element geeft in feite een naam voor het invoerformulier om de gebruikers te laten begrijpen welke invoergegevens het moeten zijn. Het fungeert als een indicator voor gebruikers.

    Syntaxis:

    …

    codes:


    Example of HTML label tag


    Boy
    Girl

    Output:

    1. "" Element

    Dit element definieert eigenlijk een bijschrift voor een element. Het is een soort ondersteunend element voor een ander element, een deel van het groepselement.

    Syntaxis:


    Celebrity:
    Name:
    Phone:
    Age:

    codes:


    Example of HTML legend tag


    Celebrity:
    Name:
    Phone:
    Age:

    Output:

    1. "" Element

    Dit element is een groepgerelateerd element dat wordt gebruikt voor opties in een vervolgkeuzelijst in HTML-vorm. Het helpt de gebruikers om gemakkelijk met een lange lijst om te gaan.

    Syntaxis:


    Ninja 300
    Ninja 450

    Pulsar 200
    Pulsar 150

    codes:



    Example of HTML legend tag


    Ninja 300
    Ninja 450

    Pulsar 200
    Pulsar 150

    Output:

    1. "" Element

    Dit element wordt gebruikt om een ​​optie uit een vervolgkeuzelijst onder element weer te geven; de vervolgkeuzelijst moet ten minste één optie bevatten.

    Syntaxis:

    …

    codes:



    Example of HTML option tag


    Bikes
    Cars
    Buses

    Output:

    1. "" Element

    Dit element wordt in principe gebruikt om de uitvoer van een berekening weer te geven (bijvoorbeeld in een scriptberekening).

    Syntaxis:

    …

    codes:



    Example of HTML output Tag

    +
    =

    Output:

    1. "" Element

    Dit element wordt gebruikt om een ​​selectie te maken uit een lijst in een formulier.

    Syntaxis:


    Bike
    Car
    Bus

    codes:



    Example of HTML select Tag


    Bike
    Car
    Bus

    Output:

    1. "" Element

    Dit element wordt gebruikt om tekstinvoer met meerdere regels te definiëren (bijv. Voor adres).

    Syntaxis:

    Plaats uw reactie:
    Plaats hier…

    codes:


    Example of HTML textarea Tag

    Plaats uw reactie:
    Plaats hier…


    Output:

    Conclusie

    Er zijn zoveel HTML-formulierelementen beschikbaar; in dit artikel hebben we enkele basis- of native HTML-formulierelementen besproken. HTML-formulierelementen helpen ons om juiste en functionele HTML-formulieren te maken. Opgemerkt moet worden dat de meeste HTML-formulierelementen enkele attributen nodig hebben om mee te nemen. Sommige elementen hangen van elkaar af en moeten samen worden gecodeerd. De elementen die al zijn verouderd, worden mogelijk niet door alle browsers weergegeven.

    Aanbevolen artikelen

    Dit is een handleiding voor HTML-formulierelementen. Hier bespreken we de inleiding en vormelementen met syntaxis en voorbeeldcode. U kunt ook onze andere voorgestelde artikelen doornemen voor meer informatie -

    1. Versies van HTML
    2. Voordelen van HTML
    3. Carrière in HTML
    4. HTML-blokken
    5. Gratis HTML-cursus
    6. HTML-frames
    7. Stel een achtergrondkleur in HTML in met Voorbeeld

    Categorie:

    Web ontwikkelingstools