[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

8 réponses

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">
4
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>
1
kilian
Messages postés
8731
Date d'inscription
vendredi 19 septembre 2003
Statut
Modérateur
Dernière intervention
20 août 2016
1 521
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);
0
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!
0
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.
0

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

Posez votre question
kilian
Messages postés
8731
Date d'inscription
vendredi 19 septembre 2003
Statut
Modérateur
Dernière intervention
20 août 2016
1 521
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);
0
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
0
kilian
Messages postés
8731
Date d'inscription
vendredi 19 septembre 2003
Statut
Modérateur
Dernière intervention
20 août 2016
1 521
21 déc. 2004 à 14:49
Argh, désolé alors, je vois pas du tout :-(

var a=unescape("%3A-%29");
document.write(a);
0
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
0
PhP
Messages postés
1767
Date d'inscription
lundi 11 décembre 2000
Statut
Membre
Dernière intervention
23 décembre 2009
607
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
0