📖 História de Abertura

Você está em um grande castelo de brinquedo.

Por dentro, ele tem vários cômodos: sala do trono, cozinha real, biblioteca encantada…

Se você quisesse organizar todos esses cômodos para construir o castelo de novo, precisaria de caixas mágicas para guardar cada parte, certo?

No HTML, essas caixas mágicas se chamam <div> — e elas são perfeitas para organizar tudo dentro de uma página.

🎭 Personagens do Capítulo

• Você: o Arquiteto do Castelo.
• HTML-2000: um robô construtor que adora separar tudo em caixinhas.

💬 Diálogo de Abertura

• Você: "Robô, quero construir um castelo organizado!"
• HTML-2000: "Perfeito! Vamos criar caixinhas mágicas para cada parte."
• Você: "E como elas funcionam?"
• HTML-2000: "Cada caixa pode guardar um pedaço diferente do castelo — e podemos dar nomes a elas!"

🧩 Conceito-Chave

O elemento <div> é como uma caixa invisível usada para agrupar outros elementos no HTML.

Não muda o visual por si só, mas ajuda a organizar e separar partes da página.

💻 Primeira Experiência (no VS Code)