Ejercicio de programación con Bootstrap: Clases de utilidad

Código
Práctica
0h 15m

Aprende a utilizar las clases de espaciado de Bootstrap 5.3 con este ejercicio práctico. Mejora tus habilidades en diseño web aplicando márgenes y paddings correctamente.

Enlaza el CDN de Bootstrap 5.3 en el <head> del documento y dentro del <body>, crea una estructura que incluya los siguientes elementos:

  • Un div con un margen inferior de 3 unidades utilizando la clase de utilidad correspondiente.
  • Un párrafo con el texto "Texto en rojo" y el color de texto rojo utilizando la clase de utilidad correspondiente.
  • Un div con un fondo azul y texto blanco utilizando las clases de utilidad correspondientes.
  • Un párrafo con tamaño de fuente grande y otro con tamaño de fuente pequeño utilizando las clases de utilidad correspondientes.
  • Un párrafo con el texto centrado utilizando la clase de utilidad correspondiente.
  • Un div que solo sea visible en pantallas medianas y grandes utilizando las clases de utilidad correspondientes.
  • Un contenedor div con dos elementos hijos dispuestos en un modelo de caja flexible (flexbox) utilizando las clases de utilidad correspondientes.
  • Un div con borde redondeado utilizando las clases de utilidad correspondientes.
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

Clases de utilidad

Utilidades y helpers

Otros tutoriales de programación con Bootstrap