He realizado la creacion de un mini menu web, con los pasos vistos en clase HTML y CSS.
He optado por la idea de un titulo, imagenes y link de esas imagenes, con ajuste de alineacion, margenes y color de fondo. Todo esto dicho aprendido en las bases del curso de Fronted.
Es un ejemplo muy simple pero se notan las bases aplicadas a lo largo del curso espero 😃
<Codigo>
```<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>Document</title></head><style>h1{
text-align: center;
color:green
}
body{
background-color: antiquewhite;
}
a{
display:block;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
p{
text-align: center;
font-size: 2vw;
color:brown
}
.padre{
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.marioimg{
width: 20%;
height: 20%;
margin: 20px;
padding: 20px;
}
.luigiimg{
width: 20%;
height: 20%;
margin: 20px;
padding: 20px;
}
.peachimg{
width: 20%;
height: 20%;
margin: 20px;
padding: 20px;
}
</style><body><h1>PLATZI TUTORIAL</h1><p>Super Mario Nintendo</p><divclass = "padre"><divclass = "mario"><aclass="navbar-brand"><imgsrc="C:\Users\Mario\OneDrive\Pictures\Mario Castillo\Code\mario.jpg"alt="logo"/><ahref="https://www.nintendo.es/Juegos/Portal-de-Nintendo/Portal-para-Super-Mario/Portal-para-Super-Mario-627604.html">Mario Bros </a></a></div><divclass = "luigi"><aclass="navbar-brand"><imgsrc="C:\Users\Mario\OneDrive\Pictures\Mario Castillo\Code\luigi.jpg"alt="logo" /><ahref="https://www.nintendo.es/Juegos/Juegos-de-Nintendo-Switch/Luigi-s-Mansion-3-1437312.html">Luigi </a></a></div><divclass = "peach"><aclass="navbar-brand"><imgsrc="C:\Users\Mario\OneDrive\Pictures\Mario Castillo\Code\peach.jpg"alt="logo" /><ahref="https://www.nintendo.es/Buscar/Buscar-299117.html?q=peach&f=147393">Peach</a></a></div></div></body></html>
NOTA: No he logrado subir una imagen, por favor si me dicen como lo hago :)
