[CSS] modifier la couleur d'un select

Fermé

marianne31 Messages postés 68 Date d'inscription vendredi 2 mai 2003 Statut Membre Dernière intervention 29 mars 2006 - 20 déc. 2004 à 16:38
Ishantiberia - 28 août 2008 à 15:02

Bonjour,

Je suis désolée de poster une deuxième fois ce message mais j'avais mis l'autre dans Internet mais il a été noyé dans les message "MSN", donc je retente ici.

Voila je souhaiterais modifier la couleur de la barre de défilement d'un select ( liste déroulante).
On m'a dit que c'était impossible, qu'il fallait utiliser du Javascript, est ce quelqu'un en saurait un peu plus ?

Merci par avance de vos réponses

Maya

A voir également:

[CSS] modifier la couleur d'un select
Modifier dns - Guide
Modifier liste déroulante excel - Guide
Modifier story facebook - Guide
Comment modifier un pdf - Guide
Excel cellule couleur si condition texte - Guide

8 réponses

Réponse 1 / 8

Ishantiberia
28 août 2008 à 15:02

Une idée qui vient très tard... Mais ayant mit du temps à trouver...

J'ai pu modifier les contours du select avec le css suivant :

input.Champ {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: italic;
font-weight: normal;
text-transform: uppercase;
color: #000000;
text-decoration: none;
background-color: #ffcc99;
}

Puis la couleur du select directement dans la balise :
<select style="width:211px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: italic; text-transform: uppercase; background-color: #ffcc99" name="Service">

Réponse 2 / 8

Blackmatrix
24 août 2008 à 15:12

On peut aisement modifier directement la couleur dans le STYLE du select comme suit

<select name="ListeSport" size="1" style="background-color:green;">
<option value="Football">Football</option>
<option value="Boxe">Boxe</option>
<option value="Athlétisme">Athlétisme</option>
<option value="Natation">Natation</option>
</select>

Réponse 3 / 8

kilian Messages postés 8732 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 5 février 2025 1 526
20 déc. 2004 à 16:53

Salut,

Par là => http://www.ksurf.net/~bermania/web/css/csspro_scrollbars.html
J'espère que ça marchera aussi pour un select...
Mais c'est possible une barre de défilement dans un select?
Ce n'est pas plutôt entre des balises <option> qu'on peut faire ça?

var a=unescape("%3A-%29");
document.write(a);

picard.1997.mode Messages postés 10 Date d'inscription samedi 17 mai 2008 Statut Membre Dernière intervention 17 mai 2008
17 mai 2008 à 14:01

tu sais bien repondre au gens!

Réponse 4 / 8

marianne31 Messages postés 68 Date d'inscription vendredi 2 mai 2003 Statut Membre Dernière intervention 29 mars 2006 4
20 déc. 2004 à 17:16

Merci

j'avais déjà essayer, en fait ça a l'air valable pour le body et les textarea mais pas pour les select, en tout cas chez moi ça marche pas.

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 8

kilian Messages postés 8732 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 5 février 2025 1 526
20 déc. 2004 à 18:19

Ok. Je viens de trouver cette discussion:
http://allhtml.com/forum/index.php?t=l&f=1&i=435400

Sur le troisième post, quelqu'un montre comment modifier le style pour la balise select:

select   {.......}

Regarde a priori ça devrait marcher, tu trouveras pleins de caractéristiques pour la couleur de la barre de défilement :-)

var a=unescape("%3A-%29");
document.write(a);

Réponse 6 / 8

marianne31 Messages postés 68 Date d'inscription vendredi 2 mai 2003 Statut Membre Dernière intervention 29 mars 2006 4
21 déc. 2004 à 08:48

j'avais déjà vu cette discussion, et j'ai essayé mais ça ne marche pas. D'ailleurs, j'y avais posté un message mais on ne m'y a pas répondu.

Merci quand même pour ton aide.

Marianne

kilian Messages postés 8732 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 5 février 2025 1 526
21 déc. 2004 à 14:49

Argh, désolé alors, je vois pas du tout :-(

var a=unescape("%3A-%29");
document.write(a);

Réponse 7 / 8

lav_prog
24 mars 2008 à 11:17

bjr a tous
svp je souhaite changer la couleur du text affiché dans un textarea et son format plus changer la couleur du scrollbar dun textarea plz aidez moi plllz

Réponse 8 / 8

PhP Messages postés 1770 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
17 mai 2008 à 15:26

Bjr

On peut assez facilement modifier la couleur d'une liste avec CSS

Ex

<html>
<head>
<style>
/* En utilisant l'id  : la liste sera rouge */
select#maliste
{
	width : 100px;
	background: #FF0000;
	color: #FFFFFF;
}

/* En utilisant la classe  : la liste sera bleue */
select.maliste
{
	width : 100px;
	background: #0000FF;
	color: #FFFFFF;
}

optgroup.groupeA
{
	color : #FF0000;
}

optgroup.groupeB
{
	color : #00FF00;
}

.opt1
{
	color : #FF0000;
}

.opt2
{
	color : #00FF00;
}

.opt3
{
	color : #0000FF;
}
</style>
<head>
<body>
<form>
<p>Ceci est une liste rouge</p>
<select id="maliste">
<option value="option1">Choix 1</option>
<option value="option2">Choix 2</option>
<option value="option3">Choix 3</option>
<option value="option4">Choix 4</option>
</select>
<p>Ceci est une liste bleue</p>
<select class="maliste">
<option value="option1">Choix 1</option>
<option value="option2">Choix 2</option>
<option value="option3">Choix 3</option>
<option value="option4" class="OPT">Choix 4</option>
</select>
<p>Ceci est une liste muticolore</p>
<select>
<option value="option1" class="opt1">Choix 1</option>
<option value="option2" class="opt2">Choix 2</option>
<option value="option3" class="opt3">Choix 3</option>
</select>

<p>Toujours plus loin avec les listes</p>
<select class="maliste">
<optgroup label="Groupe A" class="groupeA">
	<option value="option1">Choix 1</option>
	<option value="option2">Choix 2</option>
	<option value="option3">Choix 3</option>
	<option value="option4">Choix 4</option>
</optgroup>
<optgroup label="Groupe B" class="groupeB">
	<option value="option1">Choix 1</option>
	<option value="option2">Choix 2</option>
	<option value="option3">Choix 3</option>
	<option value="option4">Choix 4</option>
</optgroup>
</select>

</body>
</html>

Notez que comme d'hab le rendu n'est pas exactement le même entre FF et IE

Discussions similaires

Aide Please select boot device

Bonjour, j'ai reçu mon PC monté hier, il n'a pas encore de système d'exploitation (j'ai Windows 10 en CD à installer.). Lorsque j'allume mon ecran, voici ce qu'il m'affiche
Je ne sais pas quoi sélectionner, ni ce que cela veux dire. Pouvez vous m'aider?

sertissage des cables rj45

Bonjour,
Je voudrais savoir quel est le code de couleur pr le sertissage dun cable reseau droit et croise. De plus comment faire pr sertir les cables pr monter des switch en cascade?

Configuration: Android / Firefox 50.0

--