Atributos de Input
Parte da seção Fundamentals do Journey de HTML da Coddy — lição 37 de 60.
Aqui estão alguns outros atributos úteis para entradas de texto:
placeholder: Fornece uma dica curta que descreve o valor esperado do campo de entrada (ex: "Enter your name").value: Define o valor inicial do campo de entrada.maxlength: Especifica o número máximo de caracteres permitidos no campo de entrada.
Aqui está um exemplo de como criar uma entrada de texto com um placeholder:
<input type="text" name="username" placeholder="Enter username">Neste exemplo, temos uma entrada de texto com o nome "username" e um marcador (placeholder) que diz "Enter username". Quando o campo de entrada estiver vazio, o texto do marcador será exibido dentro do campo. Assim que o usuário começar a digitar, o texto do marcador desaparecerá.
Desafio
FácilCrie um documento HTML que inclua um formulário com os seguintes campos de entrada de texto:
- Uma entrada de texto com o name "firstname" e um placeholder que diz "Enter your first name".
- Uma entrada de texto com o name "lastname" e um placeholder que diz "Enter your last name".
- Uma entrada de texto com o name "email" e um placeholder que diz "Enter your email". Defina o comprimento máximo desta entrada para 50 caracteres.
Folha de consulta
Atributos úteis para entradas de texto:
placeholder: Fornece uma dica curta que descreve o valor esperado do campo de entradavalue: Define o valor inicial do campo de entradamaxlength: Especifica o número máximo de caracteres permitidos no campo de entrada
Exemplo de uma entrada de texto com placeholder:
<input type="text" name="username" placeholder="Enter username">O texto do placeholder é exibido quando o campo de entrada está vazio e desaparece quando o usuário começa a digitar.
Experimente você mesmo
<!DOCTYPE html>
<html>
<body>
<!-- Escreva o código aqui -->
</body>
</html>
Teste seus conhecimentosEsta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Todas as lições de Fundamentals
1Fundamentos do HTML
O que é HTML?Estrutura Básica do HTMLTags e ElementosAninhamento e Fechamento de TagsComentários em HTML7Página de Perfil Pessoal
Visão Geral do ProjetoSeção de Cabeçalho
Foto de PerfilSeção Sobre MimLinks Sociais2Texto e Formatação
TítulosParágrafosQuebras de LinhaTexto em Negrito e ItálicoNegrito e Itálico NovamenteRecapitulação - Formatação8Formulários e Inputs Parte 1
Fundamentos de FormuláriosInputs de TextoAtributos de InputCampo de SenhaLabels para InputsRecapitulação - Formulário Básico11Página de Inscrição de Evento
Visão Geral do ProjetoSeção de CabeçalhoSeção de Detalhes do EventoFormulário de InscriçãoSeção de Rodapé