Gibt es eine Möglichkeit, einen CSS-Stil auf HTML5-Datenlistenoptionen anzuwenden?

84

Ich möchte die Art und Weise ändern, in der die Liste der verschiedenen Optionen meiner Datenliste angezeigt wird. Ist es möglich, einige CSS-Eigenschaften darauf anzuwenden?

<input list="languages" id="language_id">
<datalist id="languages">
      <option value="html">HTML</option>
      <option value="java">Java</option>
      <option value="perl">Perl</option>
      <option value="php">PHP</option>
      <option value="ruby-on-rails">Ruby on Rails</option>
</datalist>

Ich habe es versucht

option {
    background: red;
}

aber es scheint nicht zu funktionieren.

n0n0bstan
quelle

Antworten:

82

Wie ausgewählte Elemente weist das Datenlistenelement nur eine sehr geringe Flexibilität beim Stil auf . Sie können keinen der vorgeschlagenen Begriffe stylen, wenn dies Ihre Frage war.

Browser definieren ihre eigenen Stile für diese Elemente.

Jason Yaraghi
quelle
136
das ist so traurig
Lloyd Banks
4
Relevant: Liste der herstellerspezifischen Firefox-CSS-Erweiterungen (einschließlich z. B. Platzhalter, aber nichts wie Datenliste): developer.mozilla.org/en-US/docs/Web/CSS/Reference/…
ANeves hält SE für böse
Ich wünschte, es gäbe eine Möglichkeit, die Stile nativer Elemente wie Datenlisten und
Auswahl
-6

Versuchen:

input[list]
{
  background: red;
}
Jarrodean
quelle
5
input[list]Formatiert in Firefox 30 das Textfeld, nicht jedoch die Liste. In IE 11 werden das Textfeld und die Liste formatiert .
Darren Griffith