Html optgroup

Postado: 22 de junho de 2022

Html optgroup

Neste artigo HTML veremos como usar o elemento HTML chamado de tag <optgroup>

A tag HTML <optgroup> cria um grupo de opções em uma lista suspensa de valores no controle <select> . Esses valores suspensos são definidos por uma série de tags <option> e agrupados usando a tag <optgroup>. 

label valor para o <optgroup> aparecerá como um título cinza acima dos itens agrupados dentro do controle <select>.

Veja o exemplo no código abaixo

  <label for="tutoriais">Tutoriais: </label>

  <select id="tutoriais">
    <optgroup label="Front-end">
      <option value="html5">HTML5</option>
      <option value="css3">CSS3</option>
    </optgroup>

    <optgroup label="Back-end">
      <option value="PHP">PHP</option>
      <option value="Mysql">Mysql</option>
    </optgroup>
  </select>

Veja o Resultado!

Observação

  • O elemento HTML <optgroup> é encontrado na tag <body> . A tag <optgroup> geralmente é encontrada dentro da tag <select> .
  • A tag <optgroup> organiza um conjunto de tags <option> em um grupo de opções com um cabeçalho de grupo.
  • labelvalor do <optgroup> aparecerá como um título cinza. Todos os itens agrupados aparecerão abaixo do título como uma lista recuada de opções.
  • Por padrão, a primeira opção na tag <select> aparecerá como o item selecionado. O usuário pode selecionar outra opção na lista suspensa.

Neste artigo abordamos sobre a tag Html optgroup.

Publicado por: loopnerd

45 Visualizações

Deixe um comentário

O seu endereço de e-mail não será publicado.

Artigos Relacionados