4.16. Introdução ao HTML
HTML, que é a sigla para HyperText Markup Language, é a linguagem de marcação utilizada para desenvolver páginas na web. Essa linguagem permite a criação de documentos que podem ser lidos em praticamente qualquer tipo de dispositivo conectado à internet. O HTML é a base para qualquer site ou aplicação web.
Estrutura Básica do HTML
Um documento HTML possui uma estrutura básica que inclui tags de abertura e fechamento. A tag de abertura indica o início de um elemento e a tag de fechamento indica o fim desse elemento. Além disso, um documento HTML é composto por uma cabeça (head) e um corpo (body).
A tag <html> indica o início e o fim de um documento HTML. Dentro desta tag, temos a tag <head> que contém informações sobre o documento, como o título que aparece na barra de título do navegador e links para arquivos CSS e JavaScript. A tag <body> contém o conteúdo principal do documento, como texto, imagens, links, tabelas, listas, etc.
Tags e Atributos
As tags HTML são os elementos que definem a estrutura do documento. Cada tag tem um significado próprio e indica ao navegador como o conteúdo deve ser exibido. Alguns exemplos de tags são: <h1> para títulos, <p> para parágrafos, <a> para links, <img> para imagens, entre outras.
Os atributos são usados para fornecer informações adicionais sobre os elementos. Eles aparecem na tag de abertura e são seguidos por um sinal de igual e um valor entre aspas. Por exemplo, na tag <a href="https://www.exemplo.com">Exemplo</a>, href é um atributo que indica o endereço do link.
Introdução ao CSS
CSS, ou Cascading Style Sheets, é uma linguagem de estilo usada para descrever a aparência de um documento escrito em HTML. Com CSS, você pode controlar o layout de várias páginas ao mesmo tempo, além de vários aspectos do design, como cores, fontes e espaçamento.
Estrutura Básica do CSS
Uma folha de estilo CSS consiste em uma lista de regras. Cada regra ou conjunto de regras consiste em um seletor e um bloco de declaração. O seletor aponta para o elemento HTML que você deseja estilizar. O bloco de declaração contém um ou mais declarações separadas por ponto e vírgula. Cada declaração inclui uma propriedade CSS e um valor, separados por dois pontos.
Seletores e Propriedades
Os seletores definem para quais elementos a regra se aplica. Eles podem selecionar elementos por tipo, classe ou ID, entre outros. As propriedades são aspectos do elemento que você pode estilizar, como cor, fonte, tamanho, margem, preenchimento, etc. O valor da propriedade define como você deseja estilizar esse aspecto.
Por exemplo, a regra CSS abaixo aplica a cor vermelha ao texto de todos os parágrafos (<p>):
<style>
p {
color: red;
}
</style>
Na regra acima, 'p' é o seletor, 'color' é a propriedade e 'red' é o valor.
Combinando HTML e CSS, você pode criar páginas web com estrutura e design sofisticados. No entanto, para adicionar interatividade e funcionalidade a um site, você precisará aprender JavaScript, que é o próximo passo na jornada para se tornar um desenvolvedor front-end.
