目前我不知道这可以仅使用 CSS 来完成。

但是，使用 jQuery 我能够达到类似的效果。

Live Demo

您的下拉列表更改，因为我必须设置选择元素的大小，使其看起来像一个列表框。也许有人可以即兴发挥。

这是我使用的 jQuery

$(document).ready(function (event) {   
    $('select').on('mouseenter', 'option', function (e) {
        this.style.background = "limegreen";
    });
    $('select').on('mouseleave', 'option', function (e) {
        this.style.background = "none";
    });
});

尝试设置 select 的轮廓和/或边框属性。

select{outline:1px solid green;border:1px solid black;}

试着改成这样，希望对你有帮助

     select option{
        background: red;
        color: #fff;
        outline:1px solid green;
       }