Desafio de formacion
Este es mi primer proyecto german
<img src ="imagen.png.jpg" alt="Diseño realizado por German" style="height: 50%"><br>
<button>Instagram</button>
<button>facebook</button>
<p>Este ejercicio es para presentar la informacion de mi primer paguina wed dejo mis redes sociales </p>
</main>
<footer>
<p style="color: white">Autor: German muñoz / HTML y CSS: ambientes de desarrollo, estructura de archivos y tags</p>
</footer>
-----------------------------------------------------//------------------------------------------------------------//----------------------------------------------------------------
CSS
/Fondo con degradado azul a blanco/
body {
background: linear-gradient(to bottom, #4A90e2 #ffffff);
font-family: "Poppins", sans-serif;
font-style: italic;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
text-align: center;
}
/* Estilo para el header */
header{
background-color: #2a5d87;
color: white;
font-weight: bold;
padding: 20px;
font-size: 24px;
width: 100%;
text-align: center;
}
/* Estilo para los botones */
button {
background: linear-gradient(45des, blue, green) ;
color: yellowgreen;
border: none;
padding: 10px 20px;
margin: 10px;
font-size: 18px;
border-radius: 5px;
cursor: pointer;
transition: 0.1s;
}
button hover {
opacity: 0.5;
}
/* Estilo para la imagen con sonbras descargadas */
img {
width:300px;
height: auto;
box-shadow: 10px 10px 20px rgba(128, 128green, 128blue, 0.5alpha);
border-radius: 10px;
margin-top: 20;
}
/* Estilo para los parrafos */
p {
font-family: "popping", sans- serif;
font-style: italic;
font-size: 18px;
color: #333;
padding: 10px;
max-width: 800;
margin: auto;
}
/* Estilo para el footer */
footer{
background-color: #1F4b6e;
color: white;
padding: 15px;
width: 100%;
text-align: center;
position: absolute;
bottom:0
}
