Jquery 随着宽度的增加自动增加列数

有人知道随着屏幕宽度的增加/减少，在不断变化的列数上显示输入的好方法吗？比如说，我有15个人。如果你的屏幕是1200像素宽，我想给你的15个人在3列，每列5人。如果你的屏幕宽度在800到1200像素之间，那么我想给你2列7和8，任何小于800像素的，我只会给你一个15人的列表

---

我正在寻找一个jQuery或angularJS解决方案。

一般来说，我不会用angularJS或javascript来做这件事，因为监听resize事件的成本相当高。为什么不使用css媒体查询

@media(min-width: 1200px){
   td:nth-child(13+n){
     display: none;
   } 
   tr:nth-child(4+n){
     display: none;
   } 
}
@media(min-width: 800ox){
   td:nth-child(8+n){
     display: none;
   } 
   tr:nth-child(3+n){
     display: none;
   } 
}

如果你真的想，你可以用这样的方法：

---

虽然链接到处理数据的特定控制器的指令或表的指令可能是更好的方法。

可以将CSS3

列

属性与媒体查询结合使用来更改它们

您有没有一个例子？最好的建议是谷歌…这里的MDN文档…用一些例子解释了所有属性例如，每个“人”的宽度和高度都是相同的，为什么不简单地将它们浮动起来呢。