Có cách nào để áp dụng kiểu CSS trên các tùy chọn danh sách dữ liệu HTML5 không?


84

Tôi muốn sửa đổi cách hiển thị danh sách các tùy chọn khác nhau trong kho dữ liệu của tôi. Có thể áp dụng trên nó một số thuộc tính CSS không?

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

Tôi đã thử

option {
    background: red;
}

nhưng nó dường như không hoạt động.


Câu trả lời:


82

Giống như các phần tử được chọn , phần tử datalist có rất ít tính linh hoạt trong việc tạo kiểu. Bạn không thể định dạng bất kỳ thuật ngữ được đề xuất nào nếu đó là những gì câu hỏi của bạn đang đặt ra.

Các trình duyệt xác định phong cách riêng của họ cho các phần tử này.


136
này là rất rất buồn
Lloyd Banks

4
Có liên quan: danh sách các tiện ích mở rộng CSS dành riêng cho nhà cung cấp Firefox (bao gồm ví dụ: trình giữ chỗ, nhưng không có gì giống như danh sách dữ liệu): developer.mozilla.org/en-US/docs/Web/CSS/Reference/…
ANeves cho rằng SE là xấu xa vào

Tôi ước có một cách nào đó để thay đổi liên tục các kiểu của phần tử gốc chẳng hạn như bộ dữ liệu và lựa chọn
t3__rry

-6

thử:

input[list]
{
  background: red;
}

5
Trong Firefox 30, tạo input[list]kiểu cho hộp văn bản, nhưng không tạo kiểu cho danh sách. Trong IE 11, nó tạo kiểu cho hộp văn bản danh sách.
Darren Griffith
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.