Co je značka volby v HTML?

Co Je Znacka Volby V Html



' ” tag se používá k definování možnosti, kterou si uživatel může vybrat z rozbalovací nabídky nebo z výběrových seznamů ve webových formulářích. ' ” umožňuje vývojářům vytvořit sadu možností, ze kterých si uživatel může vybrat libovolnou možnost. Používá se v různých aplikacích, jako jsou průzkumy, online nakupování, registrační formuláře atd.

Tento článek demonstruje značku volby v HTML spolu s praktickými příklady:





Co je značka volby a jak ji používat v HTML?

Značku volby lze použít s „ ' a ' ” tagy. V případě „ ” vytvoří seznam možností, které může prohlížeč automaticky doplňovat. Pojďme si projít několik příkladů pro lepší pochopení vztahu mezi „ ” tag s “ ' a ' ” tagy:



Příklad 1: Vytvoření rozevíracího seznamu



' Značka “ se používá s “ ” pro vytvoření rozevíracího seznamu na webové stránce. ' ” vytvoří každou možnost/položku seznamu v rozevíracím seznamu. Pro lepší pochopení postupujte podle níže uvedeného úryvku kódu:



< h2 > Programovací jazyky h2 >
< označení pro = 'prog-zbraň' > Vyberte programovací zbraň: označení >
< vybrat id = 'prog-listy' >
< volba hodnota = '' > Vyberte možnost volba >
< volba hodnota = 'c++' > C++ volba >
< volba hodnota = '.síť' > Dot Net volba >
< volba hodnota = 'nodejs' > Uzel js volba >
vybrat >

Ve výše uvedeném úryvku kódu:



  • Za prvé, „ <štítek> Pro zobrazení dat se používá tag ” a je mu přiřazen znak “ ” tag pomocí jeho “ pro ' atribut.
  • Poté se „ ” se používá k vytvoření prostředí pro rozevírací seznam.
  • Dále, „ Značka ” se používá k vytvoření položek seznamu, které se mají umístit jako položky rozevíracího seznamu.

Po nastavení struktury rozevíracího seznamu nyní použijeme některé základní styly:

označení {
displej: blok;
margin-bottom: 5px;
}
vybrat {
výplň: 5px;
border-radius: 5px;
šířka: 200px;
}

Vysvětlení vlastností CSS je popsáno níže:

  • Nejprve vyberte „ označení “ a poté nastavte hodnoty „block“ a „5px“ do CSS „ Zobrazit ' a ' okraj-dole vlastnosti.
  • Dále, „ vybrat “ je vybrán a poskytuje hodnoty „5px“, „5px“ a „200px“ do CSS „ vycpávka “, “ hraniční poloměr ' a ' šířka “ vlastnosti, resp. Tyto vlastnosti se využívají ke zlepšení viditelnosti uživatele.

Po provedení výše uvedených úryvků kódu vypadá webová stránka takto:

Výše uvedený výstup ukazuje, že rozevírací seznam byl vytvořen pomocí „ ” tag s “ ” tag.

Příklad 2: Vytvoření seznamu automatického doplňování

' Značka “ se používá s “ ” pro vytvoření seznamu automatického doplňování. Používá se spolu s „ ” tag, který se vyplní možnostmi dostupnými v seznamu automatického doplňování. Kód pro vytvoření seznamu s automatickým doplňováním pomocí HTML je uveden v následujícím fragmentu kódu:

< označení pro = 'prog-tools' > Nebo typ programovací nástroj: označení >
< vstup typ = 'text' id = 'prog-tools' seznam = 'nástroje' >
< datalist id = 'nástroje' >
< volba hodnota = 'C++' >
< volba hodnota = 'Shromáždění' >
< volba hodnota = '.Síť' >
< volba hodnota = 'PHP' >
< volba hodnota = 'Rubín' >
< volba hodnota = 'Rychlý' >
< volba hodnota = 'Uzel js' >
< volba hodnota = 'Reagovat' >
< volba hodnota = 'Mongo' >
< volba hodnota = 'Jáva' >
< volba hodnota = 'Krajta' >
datalist >

Ve výše uvedeném úryvku kódu:

  • Nejprve přidejte „ <štítek> ” tag, který zobrazuje text spolu s prvkem HTML.
  • Dále použijte „ ” tag, který uživatel vyplní ručně nebo jej lze vyplnit automaticky pomocí možností dostupných v seznamu automatického doplňování.
  • Poté použijte „ ” tag a nastavte jeho “ id “hodnota atributu rovna hodnotě “ seznam ” atributu “ ” tag.
  • Dále použijte „ ” uvnitř tagu „“, chcete-li vytvořit položku pro seznam automatického doplňování.

Po provedení výše uvedeného fragmentu kódu vypadá webová stránka takto:

Výstup ukazuje, že seznam automatického dokončování je vytvořen pomocí „ ” tag s kombinací “ ' a ' ” tagy.

Závěr

' ” umožňuje vývojáři vytvářet možnosti pro seznam možností, ze kterých si uživatel může vybrat libovolnou možnost. Tuto značku „