Caixa de multipla seleção (List box)

Artigo a respeito do controle list box (formulário web) - HTML e CSS

As list box são as combobox de multipla escolha, para isso adicionamos a propriedade multiple.

<select multiple>
    <option>Arts</option>
    <option>Politics</option>
    <option>Science</option>
    <option>Computers and internet</option>
</select>

Tudo que foi dito para a combobox é válido para a listbox, na verdade é o mesmo controle, só mudamos uma propriedade.

Ilustração de um campo list box

Se você quiser separar o conteúdo por grupo, poderá utilizar a tag optgroup como o exemplo abaixo.

<optgroup label="Option group 1">
    <option>Sub option 1</option>
    <option>Sub option 2</option>
    <option>Sub option 3</option>
</optgroup>

Veja o resultado:

See the Pen Multi-Select with Optgroup sub selection by Flávio Micheletti (@flaviomicheletti) on CodePen.

Navegue nesta série!

Comentários

comments powered by Disqus