* {
padding: 0;
margin:0;
}
main {
display: flex;
justify-content: center;
margin-top: 50px;
}
img {
width: 400px;
height: 400px;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f3e5f5;
color: #4a148c;
}
header {
background-color: #6a1b9a;
color: white;
padding: 15px;
text-align: center;
}
nav {
text-align: center;
background-color: #8e24aa;
padding: 10px;
}
nav a {
color: white;
text-decoration: none;
margin: 0 15px;
font-weight: bold;
}
a:hover {
color: #6a1b9a;
}
section {
padding: 20px;
text-align: center;
}
footer {
background-color: #6a1b9a;
color: white;
text-align: center;
padding: 10px;
position: absolute;
width: 100%;
bottom: 0;
}
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Currículum de Ada Contreras</title>
</head>
<body>
<header>
<h1>Ada Contreras</h1>
<h2>Desarrolladora Web Front-End</h2>
</header>
<nav>
<a href="#inicio">Inicio</a>
<a href="#sobre-mi">Sobre Mí</a>
<a href="#portafolio">Portafolio</a>
<a href="#contacto">Contacto</a>
</nav>
<main>
<div class="container">
<section id="inicio">
<h2>Bienvenidos</h2>
<p>Hola, soy Ada Contreras, desarrolladora web especializada en Front-End.</p>
</section>
<section id="sobre-mi">
<h2>Sobre Mí</h2>
<p>Tengo experiencia en HTML, CSS y JavaScript. Me apasiona crear interfaces atractivas y funcionales.</p>
</section>
<section id="portafolio">
<h2>Portafolio</h2>
<p>Aquí puedes ver algunos de mis proyectos destacados.</p>
</section>
<section id="contacto">
<h2>Contacto</h2>
<p>Puedes escribirme a: <strong>ada.contreras@email.com</strong></p>
</section>
</div>
<img src="perfilredondo2.png" alt="">
</main>
<footer>
<p>© 2025 Ada Contreras - Desarrolladora Web</p>
</footer>
</body>
</html>
