unique-gossip - dropdown menü

dropdown menü

Dropdown Menü mit Farbe

Beispiel:

Bewertung: ♥♥♥
Schwierigkeit: **

Erklärung

1. Kopiert den Code und fügt ihn auf eurer Webseite an der Stelle ein, wo das Menü erscheinen soll
2. Das einzige was evtl noch geändert werden soll, sind die Farben vom Hintergrund der einzelnen Links

Code
<style> select.Menue{ font-family: Verdana; font-size: 10pt; font-style: normal; font-weight: normal; } option.Menue0{ color:#FFFFFF; background-color:#404040; } option.Menue1{ color:#FFFFFF; background-color:#808080; } option.Menue2{ color:#FFFFFF; background-color:#c0c0c0; } option.Menue3{ color:#336699; background-color:#ffffff; } </style> <form><p><select class="Menue" size="1"> <option class="Menue0">Nummer 1</option> <option class="Menue1">Nummer 2</option> <option class="Menue2">Nummer 3</option> <option class="Menue2">Nummer 4</option> <option class="Menue3">Nummer 5</option> <option class="Menue3">Nummer 6</option> </select></p></form>

Frage ?!

Name
E.Mail
Homepage
Betreff
Deine Frage	(Restzeichen: 2500) </div> </div> <div id="counter"><span>Heute waren schon 46 Besucher (56 Hits) hier!</span></div> <div id="post_content"></div> <div id="sidebar_container"> <h2 id="sidebar_heading"><span></span></h2> <div id="sidebar_content"></div> </div> </div> </div> <a id="selfpromotionOverlay" href="https://www.homepage-baukasten.de/?c=4000&utm_source=selfpromotion&utm_campaign=overlay&utm_medium=footer" target="_blank" rel="nofollow"> Diese Webseite wurde kostenlos mit <b>Homepage-Baukasten.de</b> erstellt. Willst du auch eine eigene Webseite? <div class="btn btn-1">Gratis anmelden</div> </a> <style> body { padding-top: 124px; } #forFixedElement { top: 124px; } @media (min-width: 365px) { body { padding-top: 103px; } #forFixedElement { top: 103px; } } @media (min-width: 513px) { body { padding-top: 82px; } #forFixedElement { top: 82px; } } @media (min-width: 936px) { body { padding-top: 61px; } #forFixedElement { top: 61px; } } /* General button style / #selfpromotionOverlay .btn { border: none; font-size: inherit; color: inherit; background: none; cursor: pointer; padding: 6px 15px; display: inline-block; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; outline: none; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; margin: 0px; } / Button 1 */ #selfpromotionOverlay .btn-1, #selfpromotionOverlay .btn-1:visited { background: rgb(0, 85, 204); color: #fff; } #selfpromotionOverlay .btn-1:hover { background: #2980b9; } #selfpromotionOverlay .btn-1:active { background: #2980b9; top: 2px; } #selfpromotionOverlay { font: 400 12px/1.8 "Open Sans", Verdana, sans-serif; text-align: center; opacity: 1; transition: opacity 1s ease; position: fixed; overflow: hidden; box-sizing: border-box; font-size: 14px; text-decoration: none; line-height: 1.5em; flex-wrap: nowrap; z-index: 5000; padding: 14px; width: 100%; left: 0; right: 0; top: 0; color: rgb(35,35,35); background-color: rgb(246,246,246); border-bottom: 1px solid #5a5a5a; } #selfpromotionOverlay:hover { background: white; text-decoration: none; } </style> <div id="extraDiv1"><span></span></div> <div id="extraDiv2"><span></span></div> <div id="extraDiv3"><span></span></div> <div id="extraDiv4"><span></span></div> <div id="extraDiv5"><span></span></div> <div id="extraDiv6"><span></span></div> </body> </html>