0

I am css beginner and I have got a little problem How change background color of option within select element while mouse hover, I mean the blue background and white text color, without change the white background color and other options that the mouse dosen't hover on its?

option:hover {
  background-color: #ffb81f;
}
<div class="role">
  <label for="role">أي الخيارات التالية تمثل وضعك الحالي :</label><br>
  <select id="role" required>
    <option value="">اختر واحدة</option>
    <option value="طالب">طالب</option>
    <option value="موظف بدوام كامل">موظف بدوام كامل</option>
    <option value="">متفرغ للتعلم</option>
    <option value="لا أفضل الإجابة">لا أفضل الإجابة</option>
    <option value="غير ذلك">غير ذلك</option>
  </select>
</div>
Gerard
  • 15,418
  • 5
  • 30
  • 52
Anas Coder
  • 1
  • Welcome to Stack Overflow! Please visit [help], take [tour] to see what and [ask]. Do some research, ***[search for related topics on SO](https://www.google.com/search?q=change+select+options+hover+css+site:stackoverflow.com)***; if you get stuck, post a [mcve] of your attempt, noting input and expected output, preferably in a [Stacksnippet](https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/) – mplungjan Jan 01 '23 at 09:25
  • See this fiddle for a better, cross-browser compatible example - https://jsfiddle.net/getbutterfly/gquh02dz/ – Ciprian Jan 01 '23 at 18:13

0 Answers0