Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

Desafío: comparta tú proyecto con el mundo

index.html

<!DOCTYPE html>
<html lang="es-CL">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portafolio-De-Daniel</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header></header>
    <main>
        <h1>¡Aprendiendo junto a <strong>Alura Latam!</strong></h1>
        <p>¡Hola! Soy Daniel Aranzáez, y estoy realizando este curso de Alura Latam para especializarme en <span>HTML, CSS y Javascript</span>, entre otros. 
        </p>
        <a href="https://www.instagram.com/DanielRaiicHu">Instagram</a>
        <a href="https://www.github.com/DanielRaiicHu">Github</a>
        <img src="foto.png" alt="Fotografía de Daniel">
    </main>
    <footer>
        <h3 class="autor">Autor: <strong>Daniel Aranzáez</strong></h3>

    </footer>
</body>
</html>

style.css

body{
    background-color: indigo;
    color: white;
    text-align: center;
}

h1,h3,p,{
    font-family: Arial, Helvetica, sans-serif;
    font-style:normal;
}

p{
    font-size: 20px;
    column-gap: 20px; 
    width: 40%;
    text-align:center;
    margin:auto;
}

img {
    width: 300px; 
    height: auto; 
    display: block;
    margin: auto;
    border: 5px, solid, #fd22bf;

}

a{
    display: inline-block; /* Para que se comporten como botones */
    font-size: 20px;
    padding: 10px 20px; /* Espaciado interno */
    background-color: #fd22bf;
    color: white; 
    text-decoration: none; /* Elimina el subrayado */
    border-radius: 8px; /* Bordes redondeados */
    font-weight: bold;
    margin: 10px; /* Espaciado entre botones */
}

h1, p{
    margin-bottom: 40px; /* Espacio de 40px debajo de cada elemento */
}

img, a, h3 {
    margin-bottom: 20px; /* Espacio de 20px debajo de cada elemento */
}

strong{
    color: #fd22bf;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    border: 1px solid;
    padding: 2px 5px; /* Espacio interno: 5px arriba/abajo, 10px izquierda/derecha */
    letter-spacing: 0.8px; /* Espaciado entre letras */
    line-height: 1.5; /* Espaciado entre líneas */
}

.autor{
    font-size: 20px;
    font-weight: bold;
    color: white;
    text-align: center;
    margin-top: 20px;
}

header{
    background-color: aqua ;
}

span{
    color: #fd22bf;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

2 respuestas
solución!

Hola , espero que estés muy bien.

Felicitaciones por tu aprendizaje. Estamos priorizando el foro para postear dudas, así optimizamos el tiempo de respuesta para ustedes.

Te recomiendo que puedes interactuar con el resto de nuestros compañeros por nuestro Discord.

En virtud de que en Discord el alcance es mayor, la interacción es inmediata y llega a más compañeros y el foro solo quedaría para esclarecer cualquier duda que puedas tener sobre el contenido de los cursos.

De esa manera si tienes algún comentario, opinión, recomendación o algún consejo, o para compartir los desafios sea por el Discord, con certeza por ahí llegará a más personas.

Un saludo.

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios

Gracias Estudiante por compartir tu proyecto.

Saludos.