GENERAL TRACK

Sua primeira página web

Crie uma página de perfil pessoal com HTML e CSS gerados por IA.

1Noções básicas de HTML: o que são tags?

Antes de construir nossa página, vamos entender um conceito-chave: tags HTML. Pense nas tags como etiquetas em caixas. Cada tag diz ao navegador que tipo de conteúdo está dentro.

Tags são como caixas etiquetadas

<h1>

Título grande (como o título de um capítulo)

<p>

Parágrafo de texto

<ul> + <li>

Lista com marcadores e itens

Toda tag abre e fecha: <h1>content</h1>. O navegador lê essas tags e exibe o conteúdo de acordo. Clique em Executar código para ver:

HTML

<!DOCTYPE html>
<html>
<head>
  <title>Understanding Tags</title>
</head>
<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph of text.</p>
  <ul>
    <li>This is a list item</li>
    <li>This is another item</li>
  </ul>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
  <title>Understanding Tags</title>
</head>
<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph of text.</p>
  <ul>
    <li>This is a list item</li>
    <li>This is another item</li>
  </ul>
</body>
</html>

Output

Your guide

2Construindo uma página de perfil com IA

3Torne-a sua

4Suba de nível: estilização moderna com CSS

5Desafio: construa sua própria página de perfil

O que é vibe coding?

ALL TUTORIALS

Tornando as coisas interativas