Rechercher : dans
Par :

[CSS] modifier la couleur d'un select

Dernière réponse le 28 aoû 2008 à 15:02:42 marianne31, le 20 déc 2004 à 16:38:07 
 Signaler ce message aux modérateurs

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

Meilleures réponses pour « [CSS] modifier la couleur d'un select » dans :
CSS - Les couleurs Voir Les couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...
Popup en CSS, sans Javascript VoirVoici comment réaliser une popup d'information en pure CSS, sans Javascript. L'astuce est d'utiliser :hover de manière à utiliser des CSS différents au passage du curseur. Parmis les attributs CSS modifiés, on utilise display:none afin de...

1

kilian, le 20 déc 2004 à 16:53:29
  • +1

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);

Répondre à kilian

7

picard.1997.mode, le 17 mai 2008 à 14:01:56

Tu sais bien repondre au gens!

Répondre à picard.1997.mode

2

marianne31, le 20 déc 2004 à 17:16:38

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.

Répondre à marianne31

3

kilian, le 20 déc 2004 à 18:19:27

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épondre à kilian

4

marianne31, le 21 déc 2004 à 08:48:25

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

Répondre à marianne31

5

kilian, le 21 déc 2004 à 14:49:34

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

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

Répondre à kilian

6

lav_prog, le 24 mar 2008 à 11:17:52

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épondre à lav_prog

8

PhP, le 17 mai 2008 à 15:26:33

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
PhP  
Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...

Répondre à PhP

9

Blackmatrix, le 24 aoû 2008 à 15:12:29

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épondre à Blackmatrix

10

 Ishantiberia, le 28 aoû 2008 à 15:02:42
  • +1

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épondre à Ishantiberia