Diseño-de-Interfaz-con-Flexbox

Este proyecto consiste en la creación de una galería de productos utilizando Flexbox en CSS, con el objetivo de lograr un diseño responsivo que se adapte a diferentes tamaños de pantalla. Se desarrolló una interfaz web compuesta por tarjetas (cards) que representan productos. Cada tarjeta incluye una imagen, un nombre y un precio. El diseño se adapta automáticamente al tamaño del navegador, reorganizando los elementos gracias al uso de Flexbox.

Tecnologías utilizadas: HTML5 CSS3 (Flexbox)

Conceptos aplicados: display: flex → Activación del modelo Flexbox flex-wrap → Adaptabilidad y salto de línea justify-content → Alineación horizontal gap → Espaciado entre elementos Media Queries → Responsividad en dispositivos móviles

Estructura del proyecto: flexbox-cards/ │── index.html │── styles.css

Cómo ejecutar el proyecto: Descargar o clonar el repositorio Abrir el archivo index.html en cualquier navegador Redimensionar la ventana para observar el comportamiento responsivo

Resultado: Diseño limpio y organizado Tarjetas alineadas automáticamente Adaptación a diferentes tamaños de pantalla

Autor

Oliver Pardo