流式网格与自动调整列数

5
我想知道是否可以使用CSS实现以下内容:
  • DIV的网格,列数为N(可以是5到20甚至更多)
  • 网格应该是流动的,也就是说每个DIV都会随着浏览器宽度的变化而收缩和扩展,以使DIV占据浏览器宽度的100%
  • 在特定的浏览器宽度下,网格切换到N-1列布局,也就是失去一列,然后DIV再次扩展以适应浏览器宽度
  • 这个过程应该重复进行,直到布局变成基于单列的,同时DIV的宽度是流体的

很难用言语表达,但它应该与此page中的图像类似,但它应该一直到一列,而不是从三列立即跳到六列布局。

我知道我可以使用Javascript完成这个任务,就像上面的链接一样,使用@media查询(手动调整列宽),但我想知道是否有一种只使用CSS的方法,让浏览器为我完成这项工作?

谢谢。


1
如果你正在寻找仅使用CSS的解决方案,那么mediaqueries是正确的选择。 - Ben
1个回答

阿里云服务器只需要99元/年,新老用户同享,点击查看详情
1

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,