Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Aperfeiçoando Formulários com Atributos de Entrada | Formulários HTML e Entrada do Usuário
HTML Definitivo
course content

Conteúdo do Curso

HTML Definitivo

HTML Definitivo

1. Compreendendo o Desenvolvimento Web
2. Tags e Atributos HTML
3. Estrutura do Documento HTML
4. Trabalhando com Mídia e Tabelas

book
Aperfeiçoando Formulários com Atributos de Entrada

O elemento <input> do HTML permite criar diversos controles de formulário para coletar dados do usuário. É possível personalizar o comportamento e a aparência desses controles utilizando diferentes atributos. Vamos explorar alguns atributos comumente utilizados:

value

O atributo value é utilizado para definir o valor inicial do elemento <input>. O valor específico depende do tipo de entrada:

  • Para botões (type="button", type="reset", type="submit"), define o texto exibido no botão;
  • Para campos de texto (type="text") e senha (type="password"), define o valor padrão do campo de entrada;
  • Para caixas de seleção (type="checkbox") e botões de opção (type="radio"), define o valor associado ao campo de entrada.

Observação

O atributo value não pode ser utilizado com <input type="file">.

html

index.html

copy

autofocus

O atributo autofocus especifica que o campo de entrada deve receber o foco automaticamente quando a página web for carregada. Quando a página é carregada, o campo de entrada será selecionado automaticamente, permitindo que o usuário comece a digitar sem precisar clicar primeiro no campo.

Nota

O autofocus não funciona aqui porque a página não é recarregada ao clicar no botão "Run Code".

html

index.html

copy

required

O atributo required é utilizado para tornar um campo de entrada obrigatório. Ele especifica que o campo de entrada deve ser preenchido antes que o usuário possa enviar o formulário. Se o usuário tentar enviar o formulário sem preencher o campo obrigatório, uma mensagem de erro de validação será exibida indicando que o campo é obrigatório.

html

index.html

copy

placeholder

O atributo placeholder fornece uma dica ou exemplo do valor esperado para o usuário. Um texto curto é exibido dentro do campo de entrada antes que o usuário insira qualquer valor. Isso é útil para campos que exigem formatação específica, como números de telefone ou cartões de crédito.

html

index.html

copy

Nota

Nos exemplos acima, diferentes atributos type para os elementos <input> são utilizados, afetando significativamente sua aparência e funcionalidade. Você explorará mais tipos de input no próximo capítulo.

1. Qual atributo é utilizado para definir o valor padrão de um elemento de input?

2. Qual atributo é utilizado para definir uma dica ou exemplo do valor esperado para um elemento input?

3. Qual atributo é utilizado para especificar que um campo de entrada deve ser preenchido antes do envio do formulário?

question mark

Qual atributo é utilizado para definir o valor padrão de um elemento de input?

Select the correct answer

question mark

Qual atributo é utilizado para definir uma dica ou exemplo do valor esperado para um elemento input?

Select the correct answer

question mark

Qual atributo é utilizado para especificar que um campo de entrada deve ser preenchido antes do envio do formulário?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 4
Sentimos muito que algo saiu errado. O que aconteceu?
some-alt