Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Desafio: Criar Formulário com Campos e Rótulos | Formulários HTML e Entrada do Usuário
Practice
Projects
Quizzes & Challenges
Quizzes
Challenges
/
HTML Definitivo

bookDesafio: Criar Formulário com Campos e Rótulos

Objetivo

Aprimorar a experiência do usuário no site criando um formulário interativo que exija entradas para nome, e-mail e senha, cada uma com seus respectivos rótulos.

Tarefa

Adicione um formulário simples e intuitivo à sua página. Siga estes requisitos:

  1. Entrada de nome
    • Utilize um campo de texto.
    • Defina o placeholder como John.
    • Deixe o campo em foco por padrão (autofocus).
  2. Entrada de e-mail
    • Utilize um campo de e-mail.
    • Defina o placeholder como example@gmail.com.
    • Marque o campo como obrigatório.
  3. Entrada de senha
    • Utilize um campo de senha.
    • Torne este campo obrigatório.
index.html

index.html

index.css

index.css

copy
  1. autofocus: foca automaticamente o campo de entrada quando a página é carregada.
  2. required: torna o campo de entrada obrigatório, impedindo o envio do formulário se estiver vazio.
  3. placeholder: fornece uma dica ou texto de exemplo para o campo de entrada.
  4. for e id: associa um rótulo a um campo de entrada para melhorar a acessibilidade.
  5. type: especifica o tipo de dado esperado no campo de entrada (por exemplo, text, email, password).
index.html

index.html

index.css

index.css

copy
Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 6

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

bookDesafio: Criar Formulário com Campos e Rótulos

Deslize para mostrar o menu

Objetivo

Aprimorar a experiência do usuário no site criando um formulário interativo que exija entradas para nome, e-mail e senha, cada uma com seus respectivos rótulos.

Tarefa

Adicione um formulário simples e intuitivo à sua página. Siga estes requisitos:

  1. Entrada de nome
    • Utilize um campo de texto.
    • Defina o placeholder como John.
    • Deixe o campo em foco por padrão (autofocus).
  2. Entrada de e-mail
    • Utilize um campo de e-mail.
    • Defina o placeholder como example@gmail.com.
    • Marque o campo como obrigatório.
  3. Entrada de senha
    • Utilize um campo de senha.
    • Torne este campo obrigatório.
index.html

index.html

index.css

index.css

copy
  1. autofocus: foca automaticamente o campo de entrada quando a página é carregada.
  2. required: torna o campo de entrada obrigatório, impedindo o envio do formulário se estiver vazio.
  3. placeholder: fornece uma dica ou texto de exemplo para o campo de entrada.
  4. for e id: associa um rótulo a um campo de entrada para melhorar a acessibilidade.
  5. type: especifica o tipo de dado esperado no campo de entrada (por exemplo, text, email, password).
index.html

index.html

index.css

index.css

copy
Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 6
some-alt