在线预览
全屏打开
简介
瀑布流（Masonry）布局 Demo：多列等高错落排布图片或卡片。配套文章对比了多种 JS 方案与 CSS 尝试，本页为可运行演示。
如何测试验证
- 打开页面，确认卡片按列错落排列、无明显大面积空白。
- 缩放窗口宽度，观察列数与重排是否正确。
- 滚动加载更多（若支持），检查插入后布局是否错乱。
- 打开 DevTools 对比 reflow 频率，理解 JS 测高方案的成本。
瀑布流（Masonry）布局 Demo：多列等高错落排布图片或卡片。配套文章对比了多种 JS 方案与 CSS 尝试，本页为可运行演示。