O HTML define a estrutura e o conteúdo de uma página web, mas é o CSS (Cascading Style Sheets) que define o estilo e a aparência.
Com o CSS, podemos alterar cores, tamanhos, fontes e margens, tornando o site mais bonito e legível.
O que é o CSS?
CSS significa Folhas de Estilo em Cascata.
É uma linguagem que descreve como o conteúdo HTML deve ser apresentado no ecrã.
Exemplo simples:
Formas de aplicar CSS
CSS inline (diretamente na tag HTML)
- CSS interno (dentro do ficheiro HTML)
CSS externo (ficheiro separado)
Criar um ficheiro chamado
estilos.csse ligar ao HTML:
No ficheiro estilos.css:
Seletores e propriedades básicas
| Tipo | Exemplo | Descrição |
|---|---|---|
| Tag | p { color: blue; } | Afeta todos os
|
| Classe | .destaque { color: red; } | Usada com class="destaque" |
| ID | #titulo { font-size: 30px; } | Usada com id="titulo" |
Propriedades principais a conhecer nesta fase
| Categoria | Propriedades | Exemplo |
|---|---|---|
| Texto | color, font-size, font-family, text-align | color: red; |
| Fundo | background-color, background-image | background-color: lightblue; |
| Margens e espaçamento | margin, padding | margin: 10px; |
| Bordas | border, border-radius | border: 2px solid black; |
Exemplo completo
Dicas
- Escreve sempre o CSS com indentação.
- Usa cores suaves e legíveis.
- Testa várias combinações.
- Não exageres nos efeitos — o objetivo é a clareza!
Conclusão
O CSS é o complemento perfeito do HTML.
Com ele, as páginas deixam de ser simples blocos de texto e passam a ter estilo e identidade visual.
Nas próximas aulas vais aprender a criar folhas de estilo externas, a organizar melhor o código e a aplicar cores, margens e fontes em todo o site.
