web-dev-qa-db-fra.com

Modifier la couleur d'arrière-plan de l'option de sélection de liste au survol en html

Est-il possible de changer la couleur de fond par défaut de l'option de liste de sélection en survol?

HTML:

<select id="select">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>

select {
    -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px;
}

select:hover {    
    background-color:gren;
}

option:hover {
    background-color:yellow;
}

option {
    -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px;
    color:blue;
    background-color:yellow;
}

J'ai essayé l'option :hover{background-color:red;}, mais cela ne sert à rien. Est-ce que quelqu'un sait comment faire ça?

htmlcsshtml5css3
29
srihari

Actuellement, il n'y a aucun moyen d'appliquer un css pour obtenir le résultat souhaité. Pourquoi ne pas utiliser des bibliothèques comme choisi ou select2 . Ceux-ci vous permettent de styler comme vous le souhaitez.

Si vous ne voulez pas utiliser de bibliothèques tierces, vous pouvez créer une simple liste non ordonnée et jouer avec des CSS. Voici le fil que vous pouvez suivre.

Comment convertir <select> dans une liste non ordonnée en utilisant jquery?

20
Kiran Ruth R

Non, ce n'est pas possible.

Si vous créez un widget de sélection personnalisé à partir d’éléments HTML, c’est vraiment, si vous n’utilisez pas de sélections natives, t.e. "li".

3
maximkou