[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
Comment modifier un pdf - Guide
Modifier liste déroulante excel - Guide
Modifier dns - Guide
Somme si couleur - Guide
La boite a couleur - Télécharger - Divers Photo & Graphisme

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 8731 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 20 août 2016 1 527
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 8731 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 20 août 2016 1 527
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 8731 Date d'inscription vendredi 19 septembre 2003 Statut Modérateur Dernière intervention 20 août 2016 1 527
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 1767 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

"Reboot and Select proper Boot Device"

"L'indice n'appartient à la sélection" + VBA

CSS/Comment enlever couleur liens ?

[CSS] Forcé retour à la ligne

Discussions similaires

Newsletters