Bootstrap 3

Bootstrap 3 是一个CSS框架,可以让你轻松构建具有统一风格的用户界面。 在Datatables集成Bootstrap 3非常容易,功能强大的Datatables将与网站的其他部分的外观保持一致。

Bootstrap 3提供了 许多选项 来支持表格的样式,让你更加灵活的布局你的表格,同时让你看起来非常的舒服。 Datatables/Bootstrap 3集成,确保你可以使用所有这些功能以及Datatables对纯html表格所做的增强。

安装(Installation)

包括用于Datatables及其扩展的Bootstrap集成的最简单方法就是使用 Datatables下载构建器 。 在这个功能下,你可以选择你要使用的样式或者是扩展功能。

下载构建器,可以将所需的文件托管在Datatables CDN上或者下载到本地。

手动安装(Manual Installation)

如果你希望使用Datatables Git仓库 或者下载包,而不是通过Datatables下载构建器, 则Datatables及其所有扩展名都共享类似的文件命名约定,该约定可用于包括所需的文件。

DataTables

主Datatables文件名称为 jquery.dataTables.js ,使用大多数jQuery插件通用的格式。 还有一个用于Datatables支持的各种样式库的样式集成文件,其格式为 dataTables.{style}.js( 比如Bootstrap的就是 dataTables.bootstrap.js)

这两个JavaScript文件都应该包含在内-包含基本Datatables功能的主文件和用于设置合适于样式库的默认值的样式文件。

对于CSS,应仅包含一个文件,因为样式库将提供表格的核心样式选项。CSS文件的格式为 dataTables.{style}.css (比如Bootstrap的就是 dataTables.bootstrap.css )

Extensions

上述文件命名约定也适用于扩展功能

对于JavaScript,我们保留两个部分的名称,并且删除jQuery,所以我们有: dataTables.{extension}.js{extension}.{style}.js。 比如 Buttons扩展功能,包括 dataTables.buttons.jsbuttons.bootstrap.js,还包含核心库和用于设置适当默认值的样式文件。

如果是CSS文件,应当仅包含一个文件,extension.{style}.css,比如 buttons.bootstrap.css

注意,并非所有的扩展都需要样式库的JavaScript和/或者CSS。如果仓库或软件包中没有样式库,则不需要他们。

Details

如果你对Datatables文件名约定的详细信息感兴趣,请参与此 技术文档

例子

下面是基于Bootstrap 3的Datatables示例:在新的页面查看此示例

http://datatables.net/manual/styling/bootstrap

Translation from DataTables.net, with permission