HTML Combo Box med alternativ for å skrive inn en oppføring

For å utvikle HTML -skjemaer, brukes en HTML -kombinasjonsboks vanligvis. Brukeren kan velge en beslutning fra en liste over alternativer ved å bruke denne komponenten. Å bruke en kombinasjonsboks ligner på å bruke en SELECT -kode. I tillegg ber det brukerne velge et menyelement fra en liste i henhold til deres valg.

Dette innlegget vil demonstrere metoden for å lage og style en kombinasjonsboks med et alternativ attributt til å skrive inn en oppføring.

Hvordan lage en kombinasjonsboks med alternativattributt til å skrive inn en oppføring?

Funksjonaliteten til en kombinasjonsboks leveres i hovedsak ved å gruppere et HTML -inngangsfelt for tekst og et HTML -valgfelt. Mer spesifikt kan brukere legge inn tekst i inngangskontrollen ved hjelp av SELECT -kontrollen eller rett inn i tekstfeltet.

For å opprette en kombinasjonsboks med et alternativattributt til å skrive inn en oppføring, kan du prøve de uttalte instruksjonene.

Trinn 1: Lag div container

Først må du lage en DIV -beholder og sette inn en "klasse" Egenskap. Angi også et navn for klassen etter ditt valg.

Trinn 2: Legg til “” -kode

Neste, bruk "”Tag, og spesifiser navnet på rullegardinlisten.

Trinn 3: Sett inn “” -merket

Etter det, sett inn “”Tag inn mellom taggen. Deretter legger du til “verdi”Attributt inne i taggen og tilordne en verdi. Legg til tekst for alternativet mellom taggen.

Trinn 4: Opprett boks for skriv inn en oppføring

Nå, bruk "”Tag og angi“type”Attributt som“tekst”. Legg også til et navnattributt og tildel en verdi til denne attributtet:

Velg kjønnet ditt

Mann
Hunn
Annen

Som et resultat opprettes kombinasjonsboksen med muligheten til å skrive inn en oppføring:

Trinn 5: Access Div Container Class

Få tilgang til DIV Container -klassen ved å bruke velgeren med klassenavnet “.kombinasjonsboks”.

Trinn 6: Bruk CSS -egenskaper

Etter tilgang til klassen, bruk de nedenfor-listede egenskapene:

.Combo-Box
Grense: 2px solid blå;
Høyde: 70px;
Bredde: 170px;
Margin: 50px;
polstring: 30px;
Bakgrunnsfarge: Bisque;

Her:

• “grense”Eiendom brukes til å sette en grense rundt elementet.
• Sett "høyde”Av grensen for å spesifisere høyden til en spesifikk verdi.
• “bredde”Eiendom brukes til å spesifisere elementets bredde.
• “margin”Tildeler rommets ytre side av det spesifiserte området.
• “polstring”Brukes til å sette rommet inne i den definerte grensen.
• “bakgrunnsfarge”Eiendom setter en farge på baksiden eller bakgrunnen til elementet.

Produksjon

Det kan observeres at en kombinasjonsboks med muligheten til å skrive inn en oppføring er opprettet og stylet.

Konklusjon

For å opprette/lage en kombinasjonsboks med muligheten til å skrive inn en oppføring, lag først en DIV -beholder ved å bruke "”Element og også legge til en" klasse "-attributt med et bestemt navn. Deretter setter du inn “”Tag for å lage en rullegardinliste og legge til“”Element for forskjellige alternativer. Etter det, bruk "”Tag med“type”Attributt som“tekst”For å lage en tekstboks. Dette innlegget demonstrerte metoden for å lage kombinasjonsboksen med muligheten til å skrive inn en oppføring.