GENERAL TRACK

Tu primera página web

Crea una página de perfil personal con HTML y CSS generados por IA.

1Conceptos básicos de HTML: ¿qué son las etiquetas?

Antes de construir nuestra página, entendamos un concepto clave: las etiquetas HTML. Piensa en las etiquetas como etiquetas en cajas. Cada etiqueta le dice al navegador qué tipo de contenido hay dentro.

Las etiquetas son como cajas rotuladas

<h1>

Título grande (como el título de un capítulo)

<p>

Párrafo de texto

<ul> + <li>

Lista con viñetas y elementos

Cada etiqueta se abre y se cierra: <h1>content</h1>. El navegador lee estas etiquetas y muestra el contenido en consecuencia. Haz clic en Ejecutar código para verlo:

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

2Construir una página de perfil con IA

3Hazla tuya

4Sube de nivel: estilos modernos con CSS

5Reto: construye tu propia página de perfil

¿Qué es el vibe coding?

ALL TUTORIALS

Hacer las cosas interactivas