Hvordan endre fargen på en rullegardinliste

Den nedtrekkslisten er en viktig del av mange web-baserte skjemaer, som det lar nettsted brukeren kan velge fra en kompakt liste over alternativer som er definert av web-programmerer. Hvis du ønsker å gi nedtrekkslistene litt stil, kan du prøve å endre CSS "background-color" tilhører hver liste alternativ eller hele nedtrekkslisten. Ved å endre bakgrunnsfargen på konkrete alternativer, kan du gruppere lignende valg. En stilistisk endring som dette kan hjelpe brukere finner nedtrekkslisten alternativet de søker raskere.

Bruksanvisning

1 Åpne et dokument nettside i et HTML- eller tekstredigeringsprogram. For å åpne en nettside dokument ved hjelp av standard teksteditor, høyreklikk på dokumentet og klikk på «Åpne med." Klikk for å velge "Notisblokk" eller "WordPad", deretter "OK".

2 Klikk for å plassere markøren på en blank linje mellom "<form>" og "</ form>" koder som utgjør begynnelsen og slutten av ditt nettsted form. Hvis du ikke ønsker å lage rullegardinlisten som en del av et elektronisk skjema, klikk for å plassere markøren på en blank linje mellom "<body>" og "</ body>" koder, på et punkt i nettet siders dokument der du vil opprette nedtrekkslisten.

3 Type "<velg size =" 1 "style =" background-color: [ColorValue]; '> "og trykk" Enter "for å åpne rullegardinlisten tag. Bytt ut "[ColorValue]" tekst i "background-color" eiendom med en heksadesimal fargeverdi, for eksempel "# ffffff" for hvit eller "# FF0000" for rødt. Dette vil endre fargeverdi bakgrunnen for hele rullegardinlisten, men denne verdien kan overstyres ved å angi en fargeverdi bakgrunn for en individuell alternativ i nedtrekkslisten.

4 Type "<option value =" [OptionValue] 'style =' background-color: [ColorValue]; '> Alternativ Verdi </ option> "og trykk" Enter "for å skape et alternativ verdi. Bytt ut "[OptionValue]" tekst med opsjonsverdien, som er en unik form verdi som skal brukes ved behandling av skjemaet. Bytt ut "[ColorValue]" tekst med en heksadesimal fargeverdi for å endre bakgrunnsfargen bare dette alternativet.

5 Gjenta forrige trinn for å opprette flere alternativer i nedtrekkslisten. Hvert alternativ kan settes til å bruke en annen bakgrunnsfarge. Eventuelle alternativer uten en definert bakgrunnsfarge vil komme tilbake til bakgrunnsfargen som er definert i "<Velg>" tag i trinn tre.

6 Type "</ velg>" for å lukke nedtrekkslisten tag.

7 Klikk på "File" -menyen i HTML eller tekst editor, deretter "Lagre".