English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
La etiqueta HTML <optgroup> crea un grupo de opciones en la lista desplegable del control <select>. Estos valores desplegables se definen por una serie de etiquetas <option> y se agrupan con la etiqueta <optgroup>. El valor de label <optgroup> se mostrará como el título gris del grupo de items en el control <select>. Este etiqueta también se conoce como elemento <optgroup>.
Combinar opciones relacionadas con la etiqueta <optgroup>:
!doctype html> <html> <head> <meta charset="UTF-8"> <title>Uso del etiqueta HTML <optgroup> (Tutoriales básicos en la web oldtoolbag.com)</title> </head> <body> <label for="tutorial_choice">Tutoriales: </etiqueta> <select id="tutorial_choice"> <optgroup label="Web"> <option value="html">HTML</option> <option value="css">CSS</option> </optgroup> <optgroup label="Base de datos"> <option value="sql">SQL</option> <option value="oracle">Oracle</option> </optgroup> </select> </body> </html>Prueba para ver ‹/›
En este HTML5En el ejemplo de documento, usamos la etiqueta <optgroup> para crear dos grupos de opciones en la lista desplegable. El título del primer grupo de opciones es Web, y contiene dos valores desplegables-HTML y CSS. El título del segundo grupo de opciones es "Base de datos", y contiene dos valores desplegables-SQL y Oracle.
IEFirefoxOperaChromeSafari
La mayoría de los navegadores principales admiten la etiqueta <optgroup>.
La etiqueta <optgroup> organiza un grupo de etiquetas <option> en un grupo de opciones con un título de grupo.
El valor de label <optgroup> se mostrará como un título en gris. Todos los elementos del grupo se mostrarán como una lista de opciones con sangría debajo del título.
Por defecto, la primera opción del marcador <select> se mostrará como el elemento seleccionado. El usuario puede seleccionar otra opción en la lista desplegable.
Si tiene muchos grupos de opciones, puede usar la etiqueta <optgroup> para combinar opciones relacionadas de manera sencilla.
Atributo | Valor | Descripción |
---|---|---|
deshabilitado | deshabilitado | Especifica que el grupo de opciones esté deshabilitado. |
Etiqueta | Texto | Especifica una descripción para el grupo de opciones. |
La etiqueta <optgroup> admite atributos globales, consulte la tabla de atributos completa Atributos globales HTML.
La etiqueta <optgroup> admite todos Atributos de eventos HTML.