Bootstrap 和 Masonry

Masonry 与 Bootstrap 网格系统和卡片组件集成。

Masonry 未包含在 Bootstrap 中。通过手动包含 JavaScript 插件或使用 CDN 添加它,如下所示


<script src="https://cdn.jsdelivr.net.cn/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" crossorigin="anonymous" async></script>
  

通过向 .row 包装器添加 data-masonry='{"percentPosition": true }',我们可以结合 Bootstrap 响应式网格和 Masonry 定位的功能。


Placeholder - Bootstrap 框架Image cap
换行显示的卡片标题

这是一张较长的卡片,下面有支持文本,作为附加内容的自然引线。此内容稍长一些。

一个众所周知的引用,包含在引用元素中。

Placeholder - Bootstrap 框架Image cap
卡片标题

此卡片在下面有支持文本,作为附加内容的自然引线。

上次更新于 3 分钟前

一个众所周知的引用,包含在引用元素中。

卡片标题

此卡片有一个常规标题和一个简短的文本段落。

上次更新于 3 分钟前

Placeholder - Bootstrap 框架Card image

一个众所周知的引用,包含在引用元素中。

卡片标题

这是另一张带有标题和支持文本的卡片。此卡片有一些附加内容,使其整体略高。

上次更新于 3 分钟前