Resumo Semana 01

Resumo semana 01

Tópico

Conceito Principal

Exemplo/Detalhamento

Atividade Prática

<!DOCTYPE html>

Declaração que define o tipo de documento, informando ao navegador que o arquivo é HTML5.

Exemplo: <!DOCTYPE html> deve ser a primeira linha do arquivo HTML.

Criar um arquivo HTML iniciando com <!DOCTYPE html> e verificando sua exibição no navegador.

Estrutura do HTML

A estrutura básica de um documento HTML inclui <html>, <head>, <title>, <body>.

Exemplo: <html> <head> <title>Página Exemplo</title> </head> <body> </body> </html>

Criar uma página básica com título no <head> e texto no <body>.

Tags HTML

Tags definem elementos do HTML, como <p> (parágrafo), <h1> a <h6> (cabeçalhos de diferentes tamanhos), <img> (imagens).

Cabeçalhos: <h1> a <h6> definem hierarquia de títulos, sendo <h1> o maior. Exemplo: <h1>Título Principal</h1>

Criar uma página com um título principal <h1>, um subtítulo <h3> e um parágrafo <p>.

Imagens

Usadas para inserir imagens na página. Atributos importantes: src (fonte da imagem) e alt (descrição para acessibilidade).

Exemplo: <img src="imagem.jpg" alt="Descrição da imagem">

Adicionar uma imagem com src e um texto alternativo que descreva a imagem.

Listas HTML

Criar listas ordenadas (<ol>) e não ordenadas (<ul>) com itens (<li>).

Exemplo: <ul> <li>Item 1</li> <li>Item 2</li> </ul>

Criar uma lista de tarefas com <ul> e <li>.

Ênfase de Texto

Usar tags para estilizar texto: <strong> (negrito), <em> (itálico).

Exemplo: <p><strong>Importante:</strong> Aprenda HTML!</p>

Escrever uma frase com negrito e itálico usando <strong> e <em>.

Estrutura de Arquivos

Organização do projeto em pastas (ex.: css/, js/, img/) para separar estilos, scripts e imagens.

Exemplo de estrutura: /css/style.css /js/script.js /img/imagem.jpg

Criar a estrutura de pastas e adicionar um arquivo HTML que referencia uma imagem.

Primeira Página

Combinação de todos os conceitos básicos para criar uma página funcional.

Exemplo: <html> <head><title>Minha Página</title></head> <body> <h1>Bem-vindo</h1> </body>

Criar uma página com título, cabeçalho, parágrafo, imagem e lista.

Last updated 9 months ago

Was this helpful?