Bootstrap5和Masonry

半兽人 发表于: 2020-06-27   最后更新时间: 2020-06-27  

Bootstrap5和Masonry

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

Masonry不包含在Bootstrap中。通过手动加入JavaScript插件或使用CDN这样的方式来添加它。

<script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/4.2.2/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>

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

示例如下

在线运行



您需要解锁本帖隐藏内容请: 点击这里
本帖隐藏的内容




上一条: Bootstrap5 图标(Icons)
下一条: bootstrap5文本省略号2行