Introdução ao HTML e CSS: Construindo a Base da Web
- #HTML
- #CSS
O que é HTML?
HTML, ou HyperText Markup Language, é a linguagem padrão usada para criar páginas da web. Ele fornece a estrutura básica de um site, que é enriquecida com outros elementos, como CSS e JavaScript. O HTML usa uma série de elementos e tags para definir a estrutura do conteúdo, permitindo que navegadores interpretem e exibam a informação de forma organizada.
Estrutura Básica de um Documento HTML
Um documento HTML básico começa com uma declaração de tipo de documento (<!DOCTYPE html>) e é dividido em duas seções principais: o <head> e o <body>. O <head> contém metadados, como o título da página e links para folhas de estilo, enquanto o <body> contém o conteúdo visível ao usuário.
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Minha Página Web</title>
</head>
<body>
<h1>Bem-vindo ao meu site!</h1>
<p>Este é um parágrafo de exemplo.</p>
</body>
</html>
O que é CSS?
CSS, ou Cascading Style Sheets, é uma linguagem usada para estilizar e formatar a apresentação de documentos HTML. Com o CSS, você pode controlar o layout, as cores, as fontes e muitos outros aspectos visuais de uma página web.
Ele permite separar o conteúdo da apresentação, facilitando a manutenção e a consistência do design.
Estrutura Básica de uma Folha de Estilo CSS
Uma folha de estilo CSS é composta por seletores e declarações. Os seletores indicam quais elementos HTML serão afetados pelas regras de estilo, enquanto as declarações definem as propriedades a serem aplicadas.
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: #333;
text-align: center;
}
p {
line-height: 1.5;
}
Integrando HTML e CSS
A integração do HTML e CSS é feita de várias maneiras. A forma mais comum é usar uma folha de estilo externa. Para isso, você deve criar um arquivo CSS separado e vinculá-lo ao seu documento HTML usando a tag <link> dentro do <head>.
<head>
<link rel="stylesheet" href="styles.css">
</head>
Conclusão
HTML e CSS são fundamentais para a criação de sites e aplicações web. Enquanto o HTML fornece a estrutura do conteúdo, o CSS permite que você estilize e apresente esse conteúdo de maneira atraente. Aprender essas tecnologias é um passo essencial para qualquer pessoa interessada em desenvolvimento web. Com prática e criatividade, você pode criar páginas que não só informam, mas também encantam os usuários.
