HTML5表格 - 我希望在调整浏览器大小时，只需要某些列来调整宽度

Question

标题说明了一切，但这里有更多细节。我有一个8列的表。其中2列包含在调整表格时不会截断的信息，但其他列包含应完整显示的信息。因此，当表格调整大小并缩小范围时，我希望所有缩小仅在这两列中发生，而不是在其他列中。

Answer 1

给出你不想包装类的单元格（.nowrap），然后添加以下CSS：

td.nowrap {
    white-space: nowrap;
}

WORKING DEMO

Answer 2

我会使用媒体查询来实现这一目标。表格元素达到一定宽度后，隐藏或缩小列。像这样的东西，你将不得不调整它，并可能添加更多。另请查看Twitter Bootstrap。您可以使用他们的框架轻松实现这一目标。

@media (min-width: 1200px) {  
#tableColumn {
display:block;
  }
}

@media (min-width: 700px) {  
#tableColumn {
display:none;
  }
}