4

我记得一个 CSS 网格系统替代 Masonry (Vanilla) http://masonry.desandro.com/。该站点是黑色背景并显示/排列彩色框（元素周期表元素）。它还有根据形状和大小（如圆形、方形等）的过滤框。它还使用硬件加速。我花了很多时间找到它，但没有运气。有人知道这个网站吗？

4

4 回答 4

6

我正在使用这个。它适用于 Bootstrap。基本上，我使用的是 WALL，而不是容器：

<style>
.wall {
    width: 100%;
    padding: 0 20px;
    -moz-column-gap: 20px;
    -webkit-column-gap: 20px;
    column-gap: 20px;
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
} 
.wall > .brick {
    display: inline-block;
    width: 100%;
}

@media screen and (min-width:860px) {
    .wall {-moz-column-count: 2; -webkit-column-count: 2; column-count: 2;}
}

@media screen and (min-width:1280px) {
    .wall {-moz-column-count: 3; -webkit-column-count: 3; column-count: 3;}
}

@media screen and (min-width:1700px) {
    .wall {-moz-column-count: 4; -webkit-column-count: 4; column-count: 4;}
}

</style>

这是这样设计的，因此砖块必须至少为 400 像素。min-width如果您不喜欢 400 ，您可以进行数学运算并更改s。

于 2013-10-17T19:50:41.350 回答
2

我会尝试 Salvattore，它使用 CSS 进行配置和所有设计，甚至不需要接触 JavaScript。

http://salvattore.com/

于 2013-08-09T02:21:55.120 回答
1

为什么不只检查其对应物同位素的来源：http: //isotope.metafizzy.co/index.html

于 2012-12-08T17:07:02.193 回答
1

如果有人觉得它有用，这是另一种选择：http: //suprb.com/apps/nested/

于 2013-08-04T15:10:28.700 回答