Bootstrap5和Masonry

半兽人 发表于: 2020-06-27   最后更新时间: 2021-07-14 14:27:14  
{{totalSubscript}} 订阅, 3,211 游览

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的定位功能。

示例如下

在线运行

更新于 2021-07-14

查看bootstrap5更多相关的文章或提一个关于bootstrap5的问题,也可以与我们一起分享文章