Ejercicio de programación con Bootstrap: Fundamentos del sistema de grid de Bootstrap

Código
Práctica
0h 15m

Aprende a crear una página utilizando el sistema grid de Bootstrap 5.3. Organiza contenido en filas y columnas adaptativas con breakpoints y espaciados personalizados.

Crea una página HTML que utilice el sistema de grid de Bootstrap para organizar el contenido de manera responsiva. La página debe cumplir con los siguientes requisitos:

  1. Utiliza un contenedor que se ajuste al ancho.
  2. Crea una fila con tres columnas.
  3. Cada columna debe tener un texto de ejemplo que indique su posición (por ejemplo, "Columna 1", "Columna 2", "Columna 3").
  4. En tamaños de pantalla pequeños las columnas deben apilarse verticalmente.
  5. En tamaños de pantalla medianos, cada columna debe ocupar la mitad del espacio, de modo que queden de dos en dos.
  6. En tamaños de pantalla grandes y superiores, las columnas deben disponerse en una fila horizontal.
  7. Añade un gutter horizontal de 3 entre las columnas y un gutter vertical de 1.
Empezar ejercicio de programación

Todos los ejercicios de programación de Bootstrap

Evalúa tus conocimientos con ejercicios de programación en Bootstrap de tipo Test, Puzzle, Código y Proyecto con VSCode.

Certificados de superación de Bootstrap

Supera todos los retos de Bootstrap y obtén estos certificados de superación para mejorar tu currículum y tu empleabilidad.

Tutorial para resolver este ejercicio de programación

Bootstrap

Bootstrap

Fundamentos del sistema de grid de Bootstrap

Fundamentos y layout

Otros tutoriales de programación con Bootstrap