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.


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.


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;
}

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
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.