Java
Kolorowy select

Dość często stosujemy na stronach czy to jako menu czy odnośnki do innych stron czy plików pole wyboru select. Nie ma co ukrywać, że domyślny wygląd tego pola nie należy do najładniejszych. Poniżej zatem postaramy się go pokolorować stosując style css.
Domyślne pole wygląda mniej więcej tak:
natomiast pokolorowane tak jak poniżej:
Jak to zrobić?
W sekcji head strony zamieść treść stylu css:
<STYLE type="text/css">
.greySelect {background-color:#333333; font-weight:bold;}
.optionYellow{background-color:#ffcc00;}
.optionRed{background-color:#cc0000;}
.optionGreen{background-color:#336633;}
</STYLE>

Teraz stosując class'y kolorujemy każde z pól (lub nie każde :) tak jak poniżej:
<FORM>
<SELECT class="whiteSelect">
<OPTION>zobacz kolory
<OPTION class="optionYellow">kolor pierwszy</OPTION>
<OPTION class="optionRed">kolor drugi</OPTION>
<OPTION class="optionGreen">kolor trzeci</OPTION>
<OPTION class="optionYellow">kolor czwarty</OPTION>
<OPTION class="optionRed">kolor piąty</OPTION>
<OPTION class="optionGreen">kolor szósty</OPTION>
</SELECT>
</FORM>

Oczywiście class czyli np: .optionBlack{background-color:#000000;} możemy napisać i stosować zależnie od potrzeby mniej lub więcej.

Autor: webmark

drukuj