03 div
Div#
A tag <div>
é uma das tags mais utilizadas em HTML e é usada para criar seções ou grupos de conteúdo em uma página da web. A tag <div>
não tem um significado específico, mas é usada para criar contêineres de bloco que podem ser estilizados ou manipulados com CSS ou JavaScript.
<!DOCTYPE html>
<html>
<head>
<title>Título da página</title>
</head>
<body>
<div>
<h1>Este é um título principal</h1>
<p>Este é um exemplo de parágrafo em HTML.</p>
</div>
<div>
<h2>Este é um título secundário</h2>
<ul>
<li>Item 1 da lista</li>
<li>Item 2 da lista</li>
<li>Item 3 da lista</li>
</ul>
</div>
</body>
</html>
No exemplo acima, a tag <div>
é usada para agrupar o conteúdo em duas seções separadas. A primeira seção contém um título principal e um parágrafo, enquanto a segunda seção contém um título secundário e uma lista.
A tag <div>
é muito útil para organizar e estruturar o conteúdo de uma página da web. Ela permite que você agrupe diferentes elementos em uma seção lógica, o que torna o código HTML mais fácil de entender e manter. Além disso, a tag <div>
é frequentemente usada para criar layouts complexos em combinação com CSS.
Exercícios de Fixação#
-
01 - Página de perfil: Crie uma página de perfil simples com uma imagem de perfil, nome do usuário, uma breve descrição e alguns interesses listados em parágrafos separados.
-
02 - Lista de tarefas: Crie uma lista de tarefas com caixas de seleção para cada uma. Use divs para agrupar as tarefas e adicione um título para a lista.
-
03 - Card de produto: Crie um card de produto com uma imagem, nome, preço e descrição do produto.