Question

这里有一般性问题。只是想知道在移动设备上是否有一个聪明的显示宽表（IE。很多列）。

为了解释一下，我们创建了使用主站点中的ajax加载其内容的移动站点，在某些情况下，这些页面容器表具有很多列。将整个桌子安装到垂直移动设备上的唯一方法是缩小字体大小直到它不可读。

只是想知道那里是否还有其他选择。

感谢。

Answer 1

您可以为每一行使用“小部件”，而不是使用表来显示数据。这使得设计移动设备变得更加容易，并使数据以响应的方式流动。

Answer 2

我之前遇到过这个问题......由于你没有足够的空间来显示整个数据，所以很痛苦。

我当时正在使用的方式是使用可折叠项目列表。您创建的列表仅包含每行中最重要的数据，如果用户想要了解有关该行的更多信息，则可以单击该行并取消折叠，显示所有详细信息。

只是我的2美分......

Answer 3

一段时间后发现了这种技术，并将其加入书签以供将来使用，但从未发现需要做任何类似的事情，所以我没有玩过，但这是一个很好的想法：

Answer 4

如果您愿意承担风险，jQuery Mobile的beta版本（如果这个问题与之相关）会产生新的响应式表格：

基本上，如果屏幕宽度变窄，它将改变其大小以适应宽度变化。您可以使用它，以便在宽度较小时隐藏某些预定义列。目前，这是jQuery Mobile框架上响应表的最佳解决方案。

Answer 5

如何将容器的 css 设置为

#container{
    width: 100vw;
    overflow: scroll;
}

和桌子更宽

#table {
    width: 150vw;
}

所以你可以滚动浏览