le style des boîtes de sélection (dropdowns)

Question

Je sais qu'il est possible avec jquery de faire quelque chose qui ressemble à une boîte de sélection, donc je peux le faire ressembler à ce que je veux. Cependant, avec seulement du CSS, quel est le degré de contrôle dont je dispose ?

J'utilise border, padding et width, et le résultat final est excellent.

La seule chose qui me dérange, c'est la partie qui descend. Y a-t-il un contrôle sur cette partie ? (Il semble stupide d'avoir du rembourrage et de ne pas en avoir sur la liste déroulante).

Answer 1

Vous avez un certain contrôle, mais il y a beaucoup de variations entre les navigateurs et les systèmes d'exploitation. Par exemple, Internet Explorer sous Windows affichera toujours la flèche vers le bas grise standard, même si vous pouvez la recolorer dans d'autres navigateurs.

Pour ce qui est de la partie qui descend, il s'agit de balises d'option et non de sélection. Pour les modifier, vous devrez donc appliquer des styles à la balise d'option :

select {
   border: 1px solid red;
}

option {
   background-color: blue;
}

Heureusement, d'autres personnes ont fait des recherches sur ce qui fonctionne et ce qui ne fonctionne pas. Voici donc quelques ressources pour vous :

• Stylisation des contrôles de formulaires en général : http://www.456bereastreet.com/archive/200701/styling_form_controls_with_css_revisited/
• Sélectionne spécifiquement : http://www.456bereastreet.com/lab/styling-form-controls-revisited/select-single/
• Comparaison des navigateurs : http://www.electrictoolbox.com/style-select-optgroup-options-css/