Como criar uma lista drop-down de uma forma html5

listas suspensas são uma característica comum em páginas da web e HTML5 faz criá-los muito infalível. listas drop-down permite que você, o programador, para especificar um número de opções que os visitantes do seu website podem fazer sem digitar (a lista é mostrado na figura). listas suspensas são especialmente agradáveis, porque eles não requerem uma grande quantidade de tela imobiliário - as opções são visíveis apenas enquanto o usuário está selecionando-os.

listas suspensas têm um atributo incrivelmente valioso na medida em que evitar certos tipos de erros. As opções limitadas fazer a resposta muito previsível porque você predeterminar todas as respostas possíveis. Você não tem que lidar com todas as coisas loucas usuários podem digitar em uma caixa de texto.

Em HTML5 / XHTML, listas suspensas são criados por dois tipos de objeto. A estrutura geral utiliza o tags, enquanto cada uma das possíveis escolhas tem o seu próprio tag, como o código para uma página web com uma lista drop-down mostra:

formDemo.html

Demonstração Form

A lista de seleção é uma verdadeira potência, então você deve saber como fazê-lo:

  1. criar o primeiro elemento.

    Video: Menu Drop Down em css - Curso webdesign - training Web

    O recipiente para a lista é um elemento. A lista completa está encerrado no par.

  2. Dê o selecionar elemento de um ID.

    Video: Como criar um menu Dropdown com múltiplas colunas no Bootstrap



    Você vai usar esse ID para se referir ao elemento no código.

  3. Adicionar um opção elemento para o elemento select.

    Ela ajuda a recuar as opções para se lembrar que eles são parte do selecionar objeto.

  4. Dê a cada opção de um valor.

    O valor é a resposta enviada a um programa quando o usuário escolhe uma opção. O usuário não vai necessariamente ver o valor.

  5. Indicar o texto que o usuário verá entre o e Tag.

    Isso pode ser diferente do valor, ou o mesmo. (Isso fará mais sentido depois de fazer alguma codificação javascript.)

  6. Adicionar como muitas opções como quiser.

    Criar um novo objeto de opção para cada escolha que você quer ter disponível na lista.

Caixas de seleção não ter para ter o comportamento drop-down. Se você quiser que a caixa para ocupar mais espaço vertical na página, basta especificar o número de linhas com o Tamanho atributo.


Publicações relacionadas