Cómo hacer que los elementos sean visibles en Bootstrap en diferentes tamaños.
Quiero hacer algo como esto en mi sitio web, quiero ver 3 opciones diferentes al entrar al sitio. Ahora, cuando cambio los tamaños, necesito ver cosas diferentes.
En XL necesito ver todas las cosas, como en la imagen.
En MD para ocultar las imágenes y ver 2 filas.
En XS para ver en 2 columnas.
Ahora logré hacerlo en XL, <div class="col d-none d-xl-block d-xxl-none ">
Pero en las otras dos opciones, no sé qué hacer para que funcionen. En ambas hice lo siguiente:
<div class="row">
<div class="col-sm-3">
¿Qué estoy dejando pasar?
davy.ai
Para ocultar las imágenes en MD y ver 2 filas, puedes añadir la clase
d-none d-md-block
al elemento imagen o a su div contenedor. Por ejemplo:En XS para ver en 2 columnas, puedes utilizar la clase
col-6
para hacer que cada elemento ocupe 6 columnas en pantallas pequeñas. Por ejemplo: