« anterior | siguiente »

Home > 2006 > Noviembre > Lunes, 20 de Noviembre 2006 > Opciones de una SELECT agrupadas
Blogs Media: CSS Mania | VivirLatino | Sentido Web | Apps Mania

Publicidad

Lun20Nov2006

Opciones de una SELECT agrupadas

10:22 H (CET)| Temas: XHTML

Algo que no mucha gente suele conocer es que en una select de un HTML se pueden agrupar opciones. Algunos pensarán que esto es una tontería y que es imposible no saberlo, pero conozco bastantes casos de gente que usa selects y que no se fija en toda su especificación, lo cual no me extraña, porque yo jamás he tenido que crear una select agrupada, y supongo que es porque la "opción" que agrupa no es seleccionable.

Para agrupar opciones se necesita la etiqueta optgroup, la cual encerrará las opciones que pertenecen al mismo grupo, y dispondrá de un atributo label que será el texto que aparecerá agrupando las opciones.

<select name="prueba">
 <option value="1">Opción 1</option>
 <optgroup label="Opción 2">
   <option value="2.1">Opción 2.1</option>
   <option value="2.2">Opción 2.2</option>
   <option value="2.3">Opción 2.3</option>
 </optgroup>
 <option value="3">Opción 3</option>
 <optgroup label="Opción 4">
   <option value="4.1">Opción 2.1</option>
   <option value="4.2">Opción 4.2</option>
 </optgroup>
</select>

A la hora de modificar los estilos de optgroup, hay que tener cuidado que algunos los heredarán las opciones que contenga, por ejemplo el color de la letra.

Ejemplo

Relacionados

Sin comentar » Formulario

Conversación

Nombre:

Email:

(no aparecerá)

URL:

(opcional)
¿Recordar datos?

↓ Comentarios (XHTML permitido)