Select con imágenes

[lineadecodigo]

urgido, no estoy totalmente de acuerdo contigo. Yo diría que de forma general y estandar no se puede.

Si bien, si pensamos que los visitantes de nuestra web van a utilizar alguno de los navegadores de Mozilla (como el FireFox), quizas les podamos dar algo.

La idea es definir estilos CSS como una imagen de fondo (background-image). Imagen que querramos mostrar en el combo.

<style type="text/css">
<!--
.circulo {
background-image: url(circulo.jpg);
height: 50px;
width: 50px;
background-repeat: no-repeat;
}
.triangulo{
background-image: url(triangulo.jpg);
height: 50px;
width: 50px;
background-repeat: no-repeat;
}
.cuadrado{
background-image: url(cuadrado.jpg);
height: 50px;
width: 50px;
background-repeat: no-repeat;
}
-->
</style>

Ahora solo tenemos que hacer un combo y asignar a los option las clases definidas como estilos. De la siguiente manera:

<select>
<option class="cuadrado">Cuadrado</option>
<option class="circulo">Circulo</option>
<option class="triangulo">Triangulo</option>
</select>


Y ya está. Nuestro combo con imágenes.

Salu2.
Línea de Código.