Ecriture en gras pour les options d'un select [Résolu]

[benhsaien]

Bonjour,
comment faire pour afficher l'écriture en gras dans liste déroulante :

Code :

1
2
3
<select style="width:200px">
<option><b>test gras dans liste déroulant</b></option>
</select>

merci d'avance.

[thelvin]

Ce genre de mises en formes devraient être faites en CSS, et dans le cas présent c'est la seule solution.

Il faut appliquer ceci aux options que tu veux mettre en gras :

Code css :

font-weight: bold;

[benhsaien]

et pour un truc du genre que le text test1 s'affiche en gras et test2 s'affiche normal:

Code :

1
2
3
<select style="font-weight:bold;">
          <option ><?php echo "<style='font-weight:normal'>".'test1'."</style>". "test2"?></option>
     </select>

???

[Bisûnûrs]

Non, ce n'est pas possible.

[oceane751]

Code :

<option style="font-weight: bold;">

?

[Gaetan_]

Envoyé par oceane751

Code :

<option style="font-weight: bold;">

Ou en feuille de style :

Code :

1
2
3
option {
font-weight: bold;
}

[jreaux62]

Bonjour,
seul Firefox permet de personnaliser (un peu) le style.
Les autres navigateurs "imposent" leur propre style.

[Bisûnûrs]

Sauf qu'il veut qu'une partie de l'option seulement soit en gras, et non l'option entier.
Donc ce n'est pas possible.

[jreaux62]

Envoyé par Bisûnûrs

Sauf qu'il veut qu'une partie de l'option seulement soit en gras, et non l'option entier.
Donc ce n'est pas possible.

Firefox accepte les modifications sur une option pour les styles "font". Pas les autres.

Code :

1
2
3
4
5
6
7
	<select>
		<option>test 1</option>
		<option style="background:#357; color:yellow;">test 2</option>
		<option style="font-weight:bold;">test 3</option>
		<option style="font-style:italic; font-family:times">test 4</option>
		<option>test 5</option>
	</select>

Sur les <option> en particulier :
background et color fonctionnent partout.
les font-..., non.

Sur le <select> :
les font-... fonctionnent (modification globale de TOUTES les options)

Bref ! si on veut que ce soit compatible partout :

Envoyé par Bisûnûrs

Non, ce n'est pas possible.

[Bisûnûrs]

Envoyé par Bisûnûrs

Sauf qu'il veut qu'une partie de l'option seulement soit en gras, et non l'option entier.

[jreaux62]

Ah oui ! dit comme ça... "Y'a plus photo !"

J'avais interprété "une partie de l'option..." en "une partie du select...".

Du coup, il ne reste plus qu'une solution :
-> réaliser une "simulation de liste déroulante", à base de div, ul-li, JavaScript et CSS, de type "menu / sous-menu".

Et pourquoi pas en jQuery ?
-> Créer un plugin jQuery : une liste déroulante personnalisée (démo)
Que du bonheur !

[kirua99]

Bonjour, normalement ceci suffit amplement

Code :

1
2
3
4
<select style="width:200px">
<option>
<?php echo '<b>test gras dans liste déroulant </b>' ?></option>
</select>

[Bisûnûrs]

Envoyé par kirua99

normalement ceci suffit amplement

Mais bien sûr .. As-tu testé ce que tu donnes avant de proposer une solution qui ne fonctionne pas ?