Hva er opsjonskoden i HTML?

Hva Er Opsjonskoden I Html



« ”-taggen brukes til å definere et alternativ som en bruker kan velge fra en rullegardinmeny eller fra utvalgslistene i nettskjemaer. « ”-taggen lar utviklere lage et sett med alternativer der brukeren kan velge et hvilket som helst alternativ. Det blir brukt i forskjellige applikasjoner som undersøkelser, netthandelssider, registreringsskjemaer, etc.

Denne artikkelen demonstrerer alternativ-taggen i HTML sammen med praktiske eksempler:







Hva er opsjonskoden og hvordan bruker jeg den i HTML?

Alternativ-taggen kan brukes med ' ' og ' '-tagger. I tilfelle av ' ”-taggen, oppretter den en liste over alternativer som kan autofullføres av en nettleser. La oss gå gjennom et par eksempler for en bedre forståelse av forholdet mellom ' ' tag med ' ' og ' '-tagger:



Eksempel 1: Oppretting av en rullegardinliste



« '-taggen brukes med ' ”-tag for å lage en rullegardinliste på nettsiden. « ' oppretter hvert alternativ/listeelement i rullegardinlisten. For en bedre forståelse, la oss følge kodebiten nedenfor:





< h2 > Programmerings språk h2 >
< merkelapp til = 'prog-våpen' > Velg et programmeringsvåpen: merkelapp >
< plukke ut id = 'prog-lister' >
< alternativ verdi = '' > Velg et alternativ alternativ >
< alternativ verdi = 'c++' > C++ alternativ >
< alternativ verdi = '.nett' > Dot Net alternativ >
< alternativ verdi = 'nodejs' > Node js alternativ >
plukke ut >

I kodebiten ovenfor:



  • Først, ' '-taggen brukes til å vise dataene og den tildeles ' '-taggen med ' til ' Egenskap.
  • Etter det, ' ”-taggen brukes til å lage et miljø for rullegardinlisten.
  • Deretter ' '-taggen brukes til å lage listeelementer som skal plasseres som rullegardinlisteelementer.

Etter å ha satt opp strukturen til rullegardinlisten, la oss nå bruke litt grunnleggende styling:

merkelapp {
display: blokk;
margin-bottom: 5px;
}
plukke ut {
polstring: 5px;
kantradius: 5px;
bredde: 200px;
}

Forklaringen av CSS-egenskaper er beskrevet nedenfor:

  • Først velger du ' merkelapp '-elementet og sett deretter verdiene for 'block' og '5px' til CSS ' vise ' og ' marg-bunn ' egenskaper.
  • Deretter ' plukke ut '-elementet er valgt og gir verdiene '5px', '5px' og '200px' til CSS-en ' polstring ', ' grense-radius ' og ' bredde ” eiendommer, henholdsvis. Disse egenskapene brukes til å forbedre brukerens synlighet.

Etter utførelse av kodebitene ovenfor, ser nettsiden slik ut:

Utdataene ovenfor viser at rullegardinmenyen er opprettet ved å bruke ' ' tag med ' ' stikkord.

Eksempel 2: Oppretting av Autofullfør-liste

« '-taggen brukes med ' '-taggen for å lage en autofullføringsliste. Den brukes sammen med ' ”-taggen som fylles ut av alternativene som er tilgjengelige i autofullfør-listen. Koden for å lage en autofullføringsliste ved hjelp av HTML vises i kodebiten nedenfor:

< merkelapp til = 'prog-verktøy' > Eller type et programmeringsverktøy: merkelapp >
< input type = 'tekst' id = 'prog-verktøy' liste = 'verktøy' >
< dataliste id = 'verktøy' >
< alternativ verdi = 'C++' >
< alternativ verdi = 'Montering' >
< alternativ verdi = '.Nett' >
< alternativ verdi = 'PHP' >
< alternativ verdi = 'Rubin' >
< alternativ verdi = 'Fort' >
< alternativ verdi = 'Node js' >
< alternativ verdi = 'Reagere' >
< alternativ verdi = 'Mongo' >
< alternativ verdi = 'Java' >
< alternativ verdi = 'Python' >
dataliste >

I kodebiten ovenfor:

  • Først legger du til ' ”-taggen som viser teksten sammen med HTML-elementet.
  • Deretter bruker du ' ”-tagg som fylles ut av brukeren manuelt eller kan fylles ut automatisk av alternativene som er tilgjengelige i autofullfør-listen.
  • Etter det, bruk ' '-taggen og angi dens ' id ' attributtverdi lik verdien av ' liste ' attributt for ' ' stikkord.
  • Deretter bruker du ' '-taggen inne i ''-taggen for å opprette et element for autofullfør-listen.

Etter utførelse av kodebiten ovenfor, ser nettsiden slik ut:

Utdataene viser at autofullføringslisten opprettes ved å bruke ' ' tag med kombinasjonen av ' ' og ' '-tagger.

Konklusjon

« ”-taggen lar utvikleren lage alternativer for alternativlisten, der brukeren kan velge et hvilket som helst alternativ. Denne « »-taggen kan brukes med « ' og ' '-tagger i henhold til nettstedets designbehov. For å lage en rullegardineffekt brukes « »-taggen med «»-taggen og for å lage en autofullføringseffekt, bruk den med « ' tag sammen med ' ' stikkord. Denne artikkelen viser hva som er alternativet-taggen i HTML.