Ejercicio 6: Crear una maqueta html y css con títulos y párrafos
Crea una maqueta de títulos y párrafos con HTML y CSS a partir de la siguiente imagen. Implementa etiquetas de encabezado y de párrafo.

Solución interactiva
Solución con el código HTML y CSS completo
HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<title>Ejercicio 2</title>
<style>
/* Escribe tu CSS aquí */
body {
margin: 0; /* Quita el margen por defecto */
font-family: sans-serif;
}
.container {
width: 100%;
box-sizing: border-box;
margin: 0;
padding: 32px;
background: #e1d9ff;
min-width: fit-content;
}
article {
width: 100%;
box-sizing: border-box;
padding: 18px;
background: #fff;
}
article h2 {
font-size: 20px;
font-weight: 600;
margin: 0 0 16px;
}
article p {
font-size: 14px;
font-weight: 600;
}
</style>
</head>
<body>
<div class="container">
<article>
<h2>Title 1</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
commodo metus a sapien rhoncus tempor. Cras id viverra arcu. Quisque
maximus elementum rhoncus. Suspendisse et luctus lectus. Duis
vulputate a est hendrerit congue. Suspendisse scelerisque dolor nec
lectus convallis fermentum. Phasellus ultricies orci et nulla blandit,
sed mattis sem consectetur.
</p>
</article>
<article>
<h2>Title 2</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
commodo metus a sapien rhoncus tempor. Cras id viverra arcu. Quisque
maximus elementum rhoncus. Suspendisse et luctus lectus. Duis
vulputate a est hendrerit congue. Suspendisse scelerisque dolor nec
lectus convallis fermentum. Phasellus ultricies orci et nulla blandit,
sed mattis sem consectetur.
</p>
</article>
</div>
</body>
</html>