(Stand: 04.03.25, Adresse: http://www.grammiweb.de/html/html028.shtml)
Dropdown-Menüs in Farbe
CSS bietet die Möglichkeit, die doch recht langweilig gestalteten Dropdown-Menüs ein wenig farbiger zu gestalten. Dies erhöht gerade bei längeren Listen die Übersichtlichkeit und ermöglicht eine perfekte Anpassung ans eigene Layout.
Beispiel:
Binden Sie einfach folgenden Text in den Kopfbereich (zwischen <HEAD> und </HEAD>) der Seite ein:
<style>
select.Menue{
font-family: Arial;
font-size: 10pt;
font-style: normal;
font-weight: bold;
}
option.Menue0{
color:#FFFFFF;
background-color:#3E7CBB;
}
option.Menue1{
color:#FFFFFF;
background-color:#6597C9;
}
option.Menue2{
color:#FFFFFF;
background-color:#8CB1D6;
}
option.Menue3{
color:#336699;
background-color:#DCE8F1;
}
</style>
Dabei können Sie die rot markierten Parameter Ihren Wünschen entsprechend verändern. Natürlich können Sie auch Neue hinzufügen. Eine Liste der wichtigsten CSS-Funktionen finden Sie in unserer CSS-Übersicht.
Das eigentlich Menü binden Sie mit folgendem Text in den BODY-Bereich des Dokuments ein (zwischen <BODY> und </BODY>):
<form><p><select
class="Menue"
size="1">
<option class="Menue0">Bitte
wählen Sie</option>
<option class="Menue1">Eintrag</option>
<option class="Menue1">Eintrag</option>
<option class="Menue2">Eintrag</option>
<option class="Menue2">Eintrag</option>
<option class="Menue3">Eintrag</option>
<option class="Menue3">Eintrag</option>
</select></p></form>
Hierbei können Sie jeden einzelnen Eintrag mit den Formatierungen versehen, die Sie in obigem Script gewählt haben (Menue0 bis Menue3).
[an error occurred while processing this directive] [an error occurred while processing this directive]© Grammiweb.de Internetlösungen. Alle Rechte vorbehalten. Stand: 04.03.2025
Seitenanfang - Sponsor werden - Datenschutz - Medien - Impressum - Werbung - Hilfe - Kontakt