Caixa de Combinação / Suspensa

Como criar uma caixa suspensa?
Como fazer um valor selecionado na caixa de combinação?
Como criar uma caixa de opção de múltipla escolha?

Explicação

Caixa de Combinação / Suspensa


Código de Exemplo:
<form name=myform>
<select name=mytextarea>
<option name=one value=one> um </option>
<option name=two value=two> dois </option>
<option name=three value=three> três </option>
</select>
</form>

Result:

Definição:


Aqui define-se a caixa de suspensão usando as etiquetas "select" e "option". A caixa seleccionada é definida usando a etiqueta "select". O número de opções na caixa de combinação é definida utilizando a etiqueta "option". Como mostrado no exemplo damos aos utilizadores três opções para seleccionar. O nome a ser mostrado pela opção é atribuido dentro das etiquetas "option".

Opcção de Selecção Deslocável


O tamanho da opção de selecção pode ser definido pelo atributo "size" dentro da etiqueta "select".
Código de Exemplo:
<form name=myform>
<select name=mytextarea size=2>
<option name=one value=one> um </option>
<option name=two value=two> dois </option>
<option name=three value=three> três </option>
<option name=four value=four> quatro </option>
</select>
</form>

Resultado:

Opção de Selecção Múltipla


Podemos dar a opção para os utilizadores seleccionarem opções múltiplas utilizando a entidade "multiple". Portanto o utilizador pode selecionar várias opções usando as teclas "shift" e "Ctrl".
Código de Exemplo:
<form name=myform>
<select name=mytextarea size=3 multiple>
<option name=one value=one> um </option>
<option name=two value=two> dois </option>
<option name=three value=three> três </option>
<option name=four value=four> quatro </option>
</select>
</form>

Resultado:

Opção Selecção pré-Seleccionada


As opções podem ser pré-seleccionadas utilizando a entrada "selected".
Código de Exemplo:
<form name=myform >
<select name=mytextarea size=2>
<option name=one value=one> um </option>
<option name=two value=two> dois </option>
<option name=three value=three selected> três </option>
<option name=four value=four> quatro </option>
</select>
</form>

Resultado: