Cómo cambiar el color del resaltado azul en la lista desplegable del cuadro de selección

Sí, puede cambiar el fondo de la select pero no podrá cambiar el color de resaltado (cuando pase el mouse) mediante CSS.

Tienes pocas opciones:

1. Es para convertir select en ul, li tipo de seleccionar y hacer lo que quieras con esto.

2. Use bibliotecas como Choosen , Select2 o jQuery Form Styler . Estos le permiten diseñar de forma mucho más amplia y cruzada.

Creo que está buscando el outline propiedad de CSS (junto con los atributos de psuedo activos y de desplazamiento):

 /* turn it off completely */ select:active, select:hover { outline: none } /* make it red instead (with with same width and style) */ select:active, select:hover { outline-color: red } 

Detalles completos de esquema, color de contorno, estilo de contorno y ancho de contorno https://developer.mozilla.org/en-US/docs/Web/CSS/outline

Acabo de encontrar esto mientras busco una solución. Solo lo he probado FF 32.0.3

 box-shadow: 0 0 10px 100px #fff inset; 

Para ambientar el color del vuelo estacionario y evitar el color predeterminado del sistema operativo en Firefox, debe agregar un cuadro sombreado tanto a la opción de selección como a la opción de selección: declaraciones de desplazamiento, estableciendo el color de la sombra de cuadro en “seleccionar opción” al color de fondo del menú.

 select option { background: #f00; color: #fff; box-shadow: inset 20px 20px #f00 } select option:hover { color: #000; box-shadow: inset 20px 20px #00f; } 

intenta esto … Sé que es una publicación anterior, pero podría ayudar a alguien

 select option:hover, select option:focus, select option:active { background: linear-gradient(#000000, #000000); background-color: #000000 !important; /* for IE */ color: #ffed00 !important; } select option:checked { background: linear-gradient(#d6d6d6, #d6d6d6); background-color: #d6d6d6 !important; /* for IE */ color: #000000 !important; } 

Esto funciona para Firefox y Chrome, cae elegantemente al color del sistema en IE. Solo asegúrese de establecer la propiedad del título para el contenido de la opción. Le permite establecer los colores de fondo y primer plano.

 select option:checked:after { content: attr(title); background: #666; color: #fff; position: absolute; width: 100%; left: 0; border: none; } 

Acabo de encontrar este sitio que ofrece temas geniales para el cuadro de selección http://gregfranko.com/jquery.selectBoxIt.js/

y puedes probar este tema si tu problema con el aspecto general es azul – amarillo – gris