Измените цвет фона в раскрывающемся списке выберите опцию

#jquery #css #django #forms

#jquery #CSS #джанго #формы

Вопрос:

Я визуализирую форму с помощью django. Одно из полей в форме-это выбор с опциями.

Поле формы визуализации:

 {{ form.work }}  

Параметры выбора после рендеринга следующие:

 lt;select name="work" class="form-control" required="" id="id_work"gt;  lt;option value="" selected=""gt;---------lt;/optiongt;  lt;option value="chair"gt;The chairlt;/optiongt;  lt;option value="table"gt;The tablelt;/optiongt; lt;/selectgt;  

Как я могу изменить цвет фона для каждого из значений? Поэтому, когда я нажимаю стрелку раскрывающегося списка, чтобы увидеть все значения разных цветов.

Я использовал css без успеха.

 select option[value="chair"] {  background-color: red !important; }  select option:nth-child(2) {  background: red; }  

Как примечание, форма состоит из различных полей с параметрами выбора. Я использую bootstrap 4.

Спасибо

Ответ №1:

Для второго стиля вам нужно использовать nth-of-type . Но как CSS только это работает:

 select option[value="chair"] {  background-color: red; }  select option:nth-of-type(3) {  background: green; } 
 lt;select name="work" class="form-control" required="" id="id_work"gt;  lt;option value="" selected=""gt;---------lt;/optiongt;  lt;option value="chair"gt;The chairlt;/optiongt;  lt;option value="table"gt;The tablelt;/optiongt; lt;/selectgt; 

Ответ №2:

Вы также можете установить некоторый флаг, если есть только 2 раскрывающихся значения.

Комментарии:

1. Это совпадает с ответом, представленным до вас. Пожалуйста, не дублируйте ответы.