HTML, que significa Hyper Text Markup Language, é a espinha dorsal de qualquer site. É a linguagem de codificação que permite criar e organizar o conteúdo na web, incluindo texto, imagens, listas, tabelas, links e muito mais. Embora possa parecer intimidador para os iniciantes, a estrutura básica do HTML é bastante simples e direta. Neste capítulo, vamos explorar a estrutura básica do HTML, suas tags e atributos, com um foco especial nas listas em HTML.
Estrutura Básica do HTML
A estrutura básica de uma página HTML consiste em tags HTML, que são usadas para definir e organizar o conteúdo. Uma página HTML típica começa com a tag , que indica ao navegador que o documento é um arquivo HTML5. Em seguida, vem a tag , que contém todo o conteúdo da página. Dentro da tag , temos a tag
e a tag .A tag
contém informações sobre a página, como o título (que aparece na aba do navegador), links para CSS e JavaScript externos, e metadados. A tagA tag
Tags e Atributos
As tags HTML são usadas para definir e organizar o conteúdo. Cada tag é cercada por sinais de menor e maior (< e >). A maioria das tags vem em pares, com uma tag de abertura e uma tag de fechamento. A tag de fechamento é semelhante à tag de abertura, mas tem uma barra (/) antes do nome da tag.
Por exemplo, aqui está como você pode usar as tags
(parágrafo) e
(cabeçalho de nível 1):
Meu Primeiro Cabeçalho
Este é um exemplo de parágrafo.
Os atributos são usados para fornecer informações adicionais sobre uma tag. Eles são incluídos na tag de abertura e consistem em um nome de atributo e um valor de atributo. Por exemplo, a tag (imagem) geralmente vem com os atributos src (que especifica o URL da imagem) e alt (que fornece um texto alternativo para a imagem).
Listas em HTML
As listas são uma parte importante do HTML. Elas permitem organizar o conteúdo de uma maneira fácil de ler. Existem três tipos principais de listas em HTML: listas ordenadas, listas não ordenadas e listas de definição.
Uma lista ordenada é uma lista numerada. É criada usando a tag
- , com cada item da lista envolvido em uma tag
- . Por exemplo:
- Item 1
- Item 2
- Item 3
Uma lista não ordenada é uma lista com marcadores. É criada usando a tag
- , com cada item da lista envolvido em uma tag
- . Por exemplo:
- Item 1
- Item 2
- Item 3
Uma lista de definição é uma lista de termos e suas definições. É criada usando a tag
- , com cada termo envolvido em uma tag
- e cada definição envolvida em uma tag
- . Por exemplo:
- HTML
- Hypertext Markup Language
- CSS
- Cascading Style Sheets
Compreender a estrutura básica do HTML, suas tags e atributos, e como criar listas é uma parte fundamental da aprendizagem para se tornar um desenvolvedor front-end. No próximo capítulo, vamos explorar o CSS e como ele é usado para estilizar páginas HTML.