Bootstrap and Masonry
Integrar Masonry con el sistema de cuadrícula Bootstrap y el componente de tarjetas.
Masonry no está incluido en Bootstrap. Agrégalo incluyendo el complemento de JavaScript manualmente o usando una CDN como esta:
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
Al agregar data-masonry='{"percentPosition": true }'
al contenedor .row
, podemos
combinar los poderes de la grilla responsive de Bootstrap y el posicionamiento de Masonry.
Título de la tarjeta que se ajusta a una nueva línea
Esta es una tarjeta más larga con texto de respaldo a continuación como introducción natural al contenido adicional. Este contenido es un poco más largo.
Una cita muy conocida, contenida en un elemento blockquote.
Título de la tarjeta
Esta tarjeta tiene un texto de respaldo a continuación como una introducción natural al contenido adicional.
Última actualización hace 3 minutos
Una cita muy conocida, contenida en un elemento blockquote.
Título de la tarjeta
Esta tarjeta tiene un título normal y un breve párrafo de texto debajo.
Última actualización hace 3 minutos
Una cita muy conocida, contenida en un elemento blockquote.
Título de la tarjeta
Esta es otra tarjeta con título y texto de respaldo a continuación. Esta tarjeta tiene contenido adicional para hacerla un poco más alta en general.
Última actualización hace 3 minutos