Javascript 如何在一定范围内根据窗口大小调整网格平铺的大小

从本质上说，我试图找出如何复制此页面上的效果

在调整窗口大小时，使用javascript将网格分幅的大小从200到240px之间调整，以使其最适合填充屏幕

冒着重新发明轮子的风险，是否有一个javascript/jquery库已经做到了这一点？它与砖石/同位素的线条相同，但据我所知，它们不会调整元素的大小

---

如果不是的话，我想我自己也会尝试一下，理论上听起来不太复杂…

所以我看了一下这个网站，然后从头开始——我不知道有什么插件/库能达到这种效果。使用jQuery实现这种效果，您有什么特别的好处或具体的要求吗？如果不是，我强烈推荐使用媒体查询的css3响应式设计方法

我只需要少量的html和css就可以做到这一点

.icon {
    background:#ccc;
    float:left;
}

.icon img {
    width:100%;
    height:auto;
}

@media screen and (min-width:960px)  {
    .icon{
        width:20%;
    }
}

@media screen and (min-width:768px) and (max-width:959px) {
    .icon{
        width:25%;
    }
}

@media screen and (min-width:480px) and (max-width:767px) {
    .icon{
        width:33.3%;
    }
}

@media screen and (max-width:479px) {
    .icon{
        width:50%;
    }
}

根据我针对类似于您的问题的经验，媒体查询比在javascript中执行类似操作更轻量级，这既涉及到资源使用的强度，也涉及到工作量

---

如果您不熟悉媒体查询-

谢谢，乔，我想我很难做到一目了然。我已经看过媒体查询，但是我可以对每一个列的宽度百分比为100/列数的列进行一次查询，这一点并没有降低。非常感谢！