Este es un sitio sencillo con imagen en background del 50%, construido con HTML y CSS. El 15 del reto personal #100sitioswebchallenge
Puedes visualizar el sitio en: Clean Cam
DESAFÍOS
La parte más divertida de este mini proyecto fue juga con la imagen como background en la cabecera, el cual se despliega sólo en el 50% del total de la pantalla. Para lograr ese efecto use:
#mainheader {
background: url('../img/background.jpg');
background-repeat: no-repeat;
background-position: left;
background-size: 50% 100%;
height: 100vh;
}
PROCESO
Paleta de colores y estilos
Paleta de colores: F3D8DB E19EA5 9EE1DA
Tipografía:
Mockup (Bosquejo)
Este es el bosquejo del sitio hecho con Figma
HTML y CSS
Aquí se puede ver el proceso del sitio, primero hecho con HTML y posteriormente estilizado con CSS.
Sitio web responsivo
El sitio visto desde móviles
Publicación del sitio
Consulta el código del sitio en Github
Puedes visualizar el sitio en: Clean Cam
Información técnica
- Visual Studio Code
- HTML5 (Semántico)
- CSS
- Sitio responsivo
- Github
- Netlify
Recursos
Deja tus comentarios y sugerencias.
