Latest web development tutorials

formulário HTML

Formulários HTML são usadas para recolher os diferentes tipos de entrada do usuário.


Exemplos

exemplos on-line

Criar um campo de texto (campo de texto)
Este exemplo demonstra como criar um campo de texto na página HTML. O usuário pode escrever o texto em um campo de texto.

Criar um campo de senha
Este exemplo demonstra como criar um campo de senha HTML.

(Na parte inferior desta página, você pode encontrar mais exemplos).


formulário HTML

Form é uma região que contém os elementos do formulário.

elemento do formulário é permitir que o usuário inserir conteúdo na forma, por exemplo: campos de texto (textarea), listas suspensas, botões de rádio (rádio-botões), caixas (caixas de seleção) e assim por diante.

Formulário usa marcas de formulário <form> set:

<form>
.
input 元素
.
</form>


Formulários HTML - Os elementos de entrada

Na maioria dos casos são usados ​​tag form é uma marca de entrada (<input>).

O tipo de entrada é o atributo (tipo) definições de tipo. Na maioria das vezes os tipos de entrada utilizados são os seguintes:


campo de texto (campos de texto)

Através campo de texto <input type = "text"> tag para definir quando o usuário digitar letras, números e outros conteúdos em um formulário, será utilizado o campo de texto.

<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>

O navegador exibe o seguinte:

Nome:
Sobrenome:

Nota: A forma emsi não é visível. Além disso, na maioria dos navegadores, a largura padrão do campo de texto é de 20 caracteres.


campo de senha

campos de senha por tag <input type = "password"> para definir:

<form>
Password: <input type="password" name="pwd">
</form>

O navegador exibe os seguintes efeitos:

password:

Nota: Os caracteres de campo de senha não são exibidos em texto claro, mas com um asterisco ou pontos em vez.


botão de rádio (Radio Buttons)

<Input type = "radio"> tag define tabela sozinho opções da caixa

<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

O navegador exibe os seguintes efeitos:

masculino
feminino

As caixas de seleção (caixas de seleção)

<Type = "checkbox" Input> define uma caixa de seleção. Os usuários precisam selecionar uma ou várias opções de várias opções dadas.

<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>

O navegador exibe os seguintes efeitos:

Eu tenho uma bicicleta
Eu tenho um carro

(botão Enviar) Enviar

<Input type = "submit"> define o botão enviar.

Quando o usuário clica no botão OK, o conteúdo do formulário será transferido para outro arquivo. atributo action do formulário define o nome do arquivo de destino do arquivo. Definida pelo atributo do arquivo normalmente teria recebido dados de entrada relacionados com o tratamento ação. :

<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

O navegador exibe os seguintes efeitos:

Nome de usuário:

Se você digitar algumas letras na caixa de texto acima, em seguida, clique no botão OK, em seguida, os dados de entrada é transferida para a página "html_form_action.php". Esta página exibe os resultados inseridos.


experimentá-lo mais exemplos

botão de rádio (Os botões de rádio)
Este exemplo demonstra como criar botões de rádio em HTML.

As caixas de seleção (caixas de seleção)
Este exemplo demonstra como criar uma caixa de seleção em uma página HTML. O usuário pode selecionar ou desmarque a caixa de seleção.

Simples lista drop-down
Este exemplo demonstra como criar uma caixa de listagem drop-down simples em uma página HTML. caixa de listagem drop-down é uma lista opcional.

Pré-seleção drop-down list
Este exemplo demonstra como criar uma lista drop-down simples, com um valor pré-selecionado.

Os campos de texto (área de texto)
Este exemplo demonstra como criar um campo de texto (a multi-linha de controle de entrada de texto). O usuário pode escrever o texto em um campo de texto. caráter gravável de palavras não é limitado.

botão Criar
Este exemplo demonstra como criar um botão. Você pode texto no botão pode ser personalizado.

experimentá-lo instância de formulário

Formulário com fronteira
Este exemplo demonstra como desenhar uma caixa em torno dos dados com um título.

Caixa de entrada e confirme o formulário com botões
Este exemplo demonstra como adicionar uma página de formulário. Este formulário contém dois campos de entrada e um botão de confirmação.

Formulário com caixas de seleção
Este formulário contém duas caixas de seleção e um botão de confirmação.

Formulário com botões de rádio
Este formulário contém duas caixas e um botão de confirmação.

Enviar e-mail a partir de um formulário
Este exemplo demonstra como enviar e-mail de um formulário.


marcas de formulário HTML

Novo: HTML5 novo rótulo

标签 描述
<form> 定义供用户输入的表单
<input> 定义输入域
<textarea> 定义文本域 (一个多行的输入控件)
<label> 定义了 <input> 元素的标签,一般为输入标题
<fieldset> 定义了一组相关的表单元素,并使用外框包含起来
<legend> 定义了 <fieldset> 元素的标题
<select> 定义了下拉选项列表
<optgroup> 定义选项组
<option> 定义下拉列表中的选项
<button> 定义一个点击按钮
<datalist> New 指定一个预先定义的输入控件选项列表
<keygen> New 定义了表单的密钥对生成器字段
<output> New 定义一个计算结果