如何在使用 css 的下拉菜單中更改所選元素的突出顯示顏色？

Question

Hej，我在我的 Laravel 項目中做了一個標准的下拉菜單，如下所示：

<select class="product_select" name="products" id="products">
                <option value="pilsner">Pilsner</option>
                <option value="wheat">Wheat</option>
                <option value="ipa">IPA</option>
                <option value="stout">Stout</option>
                <option value="ale">Ale</option>
                <option value="alcohol-free">Alcohol Free</option>
            </select>

但是，突出顯示所選元素的標准顏色是藍色。 如何將其更改為灰色？ 有誰知道，我怎樣才能用 css 或 JavaScript 做到這一點？ 所選元素以藍色突出顯示

Answer 1

您可以使用option:hover 。 這是一個使背景顏色變灰的示例。

option:hover { 
   background-color : gray;
}