select > option .class styling

strukturart

Erfahrenes Mitglied
Hallo,

ist es mittlerweile möglich das Element option zu stylen?


CSS:
<select>
<option value="Auweg">Auweg</otion>
<option value="Badhausstrasse">Badhausstrasse</otion>
<option class="highlight" value="Bahnhofplatz">Bahnhofplatz</otion>
<option value="Bahnhofstrasse">Bahnhofstrasse</otion>
<option value="Bahnweg">Bahnweg</otion>
</select>
 
ist es mittlerweile möglich das Element option zu stylen?
Kommt ganz darauf an, was Dir da im Detail vorschwebt.

https://jsfiddle.net/spicelab/62jsr1ht/ - Klasse .highlight mit background-color formatiert

- https://blog.kulturbanause.de/2015/...buttons-und-checkboxen-individuell-gestalten/
- https://css-tricks.com/dropdown-default-styling/
- https://codepen.io/ericrasch/pen/zjDBx

Übrigens steckt in den schliessenden </option>-Tags ein Tippfehler.
 
Zuletzt bearbeitet:
zum Glück gibts Apfel + Shift + F.
https://jsfiddle.net/spicelab/62jsr1ht/ funktioniert leider nicht in chrome jedoch im ff.
Das trifft dann auf Mac/iOS zu, denn unter Win7 kann ich das nicht bestätigen.
Ein background:rgba(); würde mir schon genügen.
Die Transparenz schlägt sich dann aber nicht bis zum Seitenhintergrund durch; lediglich die Hintergrundfarbe wird blasser dargestellt.

Um grundsätzlich eine einheitliche Darstellung unter allen Betriebssystemen/Browser zu erzielen, wirst Du wohl nicht um JavaScript herumkommen.

Siehe hierzu bspw. http://www.hongkiat.com/blog/style-select-with-easydropdown-js/
 
Zuletzt bearbeitet:
Zurück