3

I'm trying to change the background color and the font color of the option inside the form select element. I've used Boostrap 5.

I would like when I have clicked shows the options with a custom background color and font color:

form select options enter image description here

The html code:

select option {
  background-color: yellow !important;
  color: red !important;
}
<div>
  <select class="form-select" aria-label="Default select example">
    <option selected id="Subject">Subject</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
  </select>
</div>

Here the official documentation.

Maybe someone can help me.

Thanks.

Minal Chauhan
  • 6,025
  • 8
  • 21
  • 41
d_codesys
  • 103
  • 1
  • 9
  • It's not really possible and nothing to do with Bootstrap https://stackoverflow.com/questions/1895476/how-do-i-style-a-select-dropdown-with-only-css – Carol Skelly Apr 23 '21 at 13:10

1 Answers1

1

I Don't know if I understanded you but try this..

select option:checked {
  background-color: red !important;
  color: white!important;
}

It will set a custom colors for selected item if that what u want.

Dreamer64
  • 923
  • 2
  • 13
  • 30