Desenvolvendo o HTML Básico
Todo arquivo HTML é um código de marcação que começa e termina com as tags HTML <html> </html>. Todos os elementos da nossa página estão contidos entre essas tags. Além disso, temos o cabeçalho <head> </head>, onde inserimos informações de configuração da nossa página e título e as tags <body> </body> que contém o “corpo” da página. Veja a estrutura geral abaixo.
Agora insira o título (que aparece no topo da aba ou janela) um título primário com a tag <h1> e um parágrafo <p> ao corpo da página.
Salve o seu arquivo (ctrl + s) e abra no navegador. Observe o resultado das marcações.
Agora vamos inserir um pequeno formulário para que o usuário digite o número do seu palpite utilizando as tags <label> e <input>.
Salve e observe o resultado no seu navegador.
Agora, insira um botão utilizando outra tag <input> com o tipo “submit” para envio do palpite do jogo.
Para finalizar, insira três parágrafos no corpo da página para apresentarmos os resultados da rodada com a tag <p>.
Salve e observe o resultado. Você deve ter chegado nesse ponto.
Resumo
Neste ponto, aprendemos a:
-
Instalar e utilizar o ambiente de desenvolvimento Visual Studio Code.
-
Montar a estrutura geral de um documento HTML, com as tags <html>, <head> e <body>.
-
A tag <body> contém todos os elementos que são mostrados na nossa página.
-
<title> apresenta o título da janela ou aba no navegador
-
<h1> apresenta um título de nível 1 na página (também temos <h2>, <h3>, …)
-
<p> apresenta um parágrafo;
-
<input> pode apresentar tanto um campo de digitação de texto ou um botão dependendo do valor do atributo type.
-
<input type=”text” />: é um campo de texto;
-
<input type=”submit” />: é um botão de submissão.
-