zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Auswahlfeld farbig

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 29.03.2021, 16:25
Benutzerbild von wandler
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 11.01.2006
Beiträge: 48
wandler befindet sich auf einem aufstrebenden Ast
Standard Auswahlfeld farbig

Hallo,

ich will in einem Formular das Auswahlfeld optisch mit Farben darstellen. Diese Farben ergänzen quasi den Inhalt des jeweiligen Elements.
Die Farben werden soweit auch angezeigt, allerdings beim Auswählen mit der Maus (:hover) wird die Hintergrundfarbe dann Blau angezeigt und mir ist nicht bekannt, wie ich das verhindern bzw. ändern kann.
Kennt jemand dazu eine Lösung?

Code:
select > option[value="0"] {
  background: white;
  color: black;
}
select > option[value="1"] {
  background: green;
  color: white;
}
select > option[value="2"] {
  background: orange;
  color: black;
}
select > option[value="3"] {
  background: red;
  color: black;
}
select > option[value="4"] {
  background: black;
  color: white;
}
HTML-Code:
<select id="...">
  <option value="0">Inaktiv</option>
  <option value="1">Stufe 1</option>
  <option value="2">Stufe 2</option>
  <option value="3" selected="">Stufe 3</option>
  <option value="4">Stufe 4</option>
</select>
Danke!
__________________
Coden ist keine Esoterik, also lasst uns an eurem Wissen teilhaben ihr Gurus
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 29.03.2021, 16:35
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.136
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Die werden vom OS gerendert, auf die Elemente hast du an der Stelle keinen Einfluss. Du kannst mit HTML, CSS und JS dein eigenes Select nachbauen, dann kannst du natürlich alles so stylen wie du willst.
Also so etwas: https://select2.org (ist ein plugin für jquery, gibt auch genug die ohne dem auskommen. und auch welche die mehr oder weniger accessible sind, das ist select2 nämlich nicht wirklich)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.03.2021, 08:55
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 23.01.2018
Beiträge: 156
basti1012 befindet sich auf einem aufstrebenden Ast
Standard

Man könnte es auch so machen
https://codepen.io/basti1012/pen/mdRrgjm
Mit Zitat antworten
Antwort

Stichwörter
auswahlfeld, farbig

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Menüpunkt auf dem man sich befindet farbig hinterlegen Thorxel CSS 5 29.05.2015 15:15
Texte (bzw. Wörter) farbig hinterlegen jushi CSS 3 19.08.2010 13:39
Überschrift farbig unterstreichen Duderinho CSS 5 14.04.2010 13:04
HTML als Text ausgeben und HTML farbig markieren cabotine Serveradministration und serverseitige Scripte 9 02.09.2008 22:56
Navigationspunkt soll farbig hervorgehoben werden geierschnabel CSS 2 19.04.2007 16:56


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:33 Uhr.