/ / Hvordan man opretter en rulleliste i HTML

Sådan laves en rulleliste i HTML

Den enkleste rulleliste i HTML er let at oprette ved hjælp af det valgte tag. Dette er et containermærke, optionskoder er indlejret i det - de specificerer listeelementerne.

Der er flere listemuligheder, du kanLav ved hjælp af markeringen: en rulleliste (indstillinger falder ud efter at have klikket på hovedfeltet eller svævet over det) og en liste over flere valg - i det kan brugeren vælge flere emner. De førstnævnte er mere almindelige; de ​​er et vigtigt element i navigationen på moderne websteder. Multipelvalg-rulleliste kan f.eks. Anvendes i kataloger, hvor det er nødvendigt at vælge flere produktegenskaber.

rulleliste

Du kan ændre udseendet og egenskaberne for lister ved hjælp af universelle og specielle attributter.

Vælg tagattributter

1. Multiple - indstiller et multiple choice.

2.Størrelse - angiver antallet af synlige linjer på listen, dvs. højde. Og her afhænger det alt af, om den flere attribut er til stede eller ej. Hvis ja, og du ikke angiver størrelse, så hvis der er flere, vil brugeren se alle de mulige valg, hvis flere er fraværende, vises kun en linje, og besøgende kan læse resten, når han klikker på elevatorikonet til højre. Hvis højdestørrelsen er indstillet, og den er mindre end antallet af indstillinger, vises en rullebjælke til højre.

3. Navn - navn. Rullelisten kan undvære det, men det kan være nødvendigt for interaktion med handlerprogrammet på serveren. Som regel er navnet stadig angivet.

Det valgte tag har ingen påkrævede attributter, i modsætning til indstillingsmærket.

html-dropdown

Attributter for det indlejrede indstillingsmærke

  1. Valgt - designet til at fremhæve en liste. Brugeren vil være i stand til at vælge mere end et element, hvis den flere attribut er specificeret (se ovenfor).
  2. Værdi - værdi. Denne attribut er påkrævet. Webserveren skal forstå nøjagtigt, hvilke listeelementer brugeren har valgt.
  3. EtiketVed hjælp af denne attribut kan du forkorte lister, der er for lange. For eksempel vises "Milan" på skærmen i stedet for den, der er angivet i indstillingsmærket, "Milan er Lombardiets administrative centrum. Norditalien ". Denne attribut bruges også til at gruppere elementer på en liste.

Hvad angår bredden på listen, indstilles den som standard i henhold til længden på den bredeste tekst på listen. Naturligvis kan bredden ændres ved hjælp af HTML-stilarter.

Dropdown-liste på andre måder

Det kan gøres ved hjælp af f.eks. CSS,listen vises, når du holder musepekeren over et sideelement. Javascript er en fantastisk måde at oprette lister på, og Jquery-biblioteket gør det let. Rullelisten, der er tilsluttet ved hjælp af dette bibliotek, kan være meget kompleks, f.eks. Det vil sige, når du vælger et emne på en liste, vises følgende liste, for eksempel er der et menupunkt "Dametøj" (typer tøj falder ud, når du hover), så når du vælger en af ​​typerne, for eksempel "Overtøj", vises en liste med elementerne: jakker parker, frakker, korte frakker, pelsfrakker osv.

jquery-dropdown

Vi har overfladisk anført de vigtigste metoder tilhjælp, som du kan oprette en rulleliste. Der er selvfølgelig en masse nuancer i HTML, i CSS og JavaScript, som giver dig mulighed for at ændre funktionalitet og udseende på lister.