如何创建 facebook 风格的时间线，但采用 3 种不同风格的响应式设计？
预计会是什么
代码：
<div class="timeline">
<div class="item item-1">
blablabla....
</div>
<div class="item item-2">
blablabla....
</div>
<div class="item item-3">
blablabla....
</div>
<div class="item item-4">
blablabla....
</div>
<div class="item item-5">
blablabla....
</div>
<div class="item item-6">
blablabla....
</div>
<div class="item item-1">
blablabla....
</div>
<div class="item item-2">
blablabla....
</div>
<!-- It just goes on and on... -->
</div>
桌面（最小宽度：980px）
排成一排的 3 个盒子，按照它们的数量排列。
.item-1然后.item-4去第一排，.item-2然后.item-5去第二排，以此类推。
平板电脑（最小宽度：768px）
连续2盒。.item-1 .item-3然后.item-5去第一排，.item-2 .item-4然后.item-6去第二排。
电话（最大宽度：767 像素）
只需将它们排成一行。
附加信息
这种风格应该适合任何高度的内容。像这样：
或者像这样的东西也可以接受，不需要将框放入正确的列中，只要它们均匀放置并以正确的顺序排列即可。
对不起我的英语不好，我是中国人。但是可以自由地写任何东西。我可以阅读它们。