Criando um Site – Parte 7

Continuando…

As caixas de seleção são caixas que você pode selecionar várias em um mesmo conjunto. Você pode criar caixas de seleção assim:

<input type="checkbox" name="check" id="box" />

Salve e atualize. Você irá ver um controle com esta aparência, mais ou menos:

Você também pode usar o atributo id deste controle para acrescentar um rótulo. Só adicionar na frente <label for=”box”>Rótulo</label>. Se você enviar por e-mail, irá aparecer o seguinte:

check=OFF (pois está desativada)

As caixas de opção são um pouco mais complicadas. Elas são criadas com o atributo <input type=”radio”>. Pegue o seguinte exemplo:

<input type="radio" name="sexo" id="m" value="m" /><label for="m">Masculino</label><br />

<input type="radio" name="sexo" id="f" value="f" /><label for="f">Feminino</label>

A tag <input type=”radio”> geralmente tem um nome comum entre todas as suas opções (o valor do atributo name) e cada uma tem um valor (o valor do atributo value). Não entendeu? Copie isso e cole; veja. Se você enviar por e-mail, irá aparecer, por exemplo, o seguinte:

sexo=m

Agora vamos aprender a criar blocos de texto grandes, usando a tag <textarea>. Se você salvar e abrir, vai ver um bloco de texto. Veja alguns atributos dessa tag:

• rows: Número de linhas
• cols: Número de colunas
• name: O nome do controle (é comum entre todos menos o botão e a caixa de grupo – Parte 8)

Agora, os botões. Para cada um, existem três valores no atributo <input type=”"> Veja:

• submit: Botão de envio de formulário. Este é o mais importante de todos. Sem ele, você não envia seu formulário
• reset: Apaga todos os valores de todos os controles do formulário
• button: Botão comum

Todas tem o atributo value. Seu valor é o texto do botão. Por exemplo:

<input type="submit" value="Enviar"/>

Agora o último atributo: o <option>. Este serve para criar caixas de combinação e de listagem, através do atributo size. A sintaxe é essa:

<select name="cidades">

<option value="spcapital">São Paulo</option>

<option value="cot">Cotia</option>

<option value="osa">Osasco</option>

<option value="tbs">Taboão da Serra</option></select>

Ao salvar e abrir o arquivo no navegador, você verá algo semelhante a isso:

Ao mandar isso por e-mail será semelhante a como mandar com o atributo <input type=”option”>

Para criar caixas de listagem, na tag select, coloque o atributo size seguido do tamanho da caixa de listagem em itens. Por exemplo: size=”3″ mostra 3 itens por vez na caixa de listagem.

O atributo disabled se aplica as tags select e option e o atributo selected, que indica quando o objeto está selecionado inicialmente, e tem valor selected, se aplica apelas a tag option

Na próxima parte vamos aprender a criar caixas de grupo, listas agrupadas, botões com imagem e upload de arquivos.

Até a próxima postagem

Páginas: 1 2