响应式

响应式网页设计的现代世界中,表格的基于行的布局常常会给设计师带来特定的问题。Responsive 是 DataTables 的一个扩展,它通过从表格中动态插入和删除列来针对不同的屏幕尺寸优化表格布局,从而解决了该问题。

下载

获取并使用 Responsive 最简单的方法是使用DataTables 下载构建器,您可以在其中选择想要在页面上使用的软件,并为您创建和托管单个 JavaScript 和 CSS 文件。

或者,还可以将个人文件包含在您的页面中、下载发行包或在 GitHub 上克隆源代码控制存储库

初始化

Responsive 可通过 多种不同的方式用于 DataTables。其中最简单的选项是将responsive选项添加到具有布尔值的数据表选项中(也可以使用对象进行精细控制 - 有关详细信息,请参阅参考文档)

$('#myTable').DataTable( {
    responsive: true
} );

特性

主要特性包括

  • 将响应式设计扩展到 HTML 表
  • 在断点处完全控制列可见性或自动可见性
  • 从表格中折叠的详细信息显示在子行中
  • 与 DataTables 无缝集成
  • 可与 Bootstrap、Foundation 和其他响应式 CSS 框架配合使用