Bootstrap 4

Bootstrap 4是一个 CSS 框架，它使你可以快速轻松地构建具有统一观感的用户界面。DataTables 提供了与 Bootstrap 4 的完全集成，这样你的 DataTables 即可与网站的其余部分匹配相同的观感。

Bootstrap 4 为 HTML 表格提供了 大量选项 进行样式设置，为表格提供了灵活性，确保它们看起来非常简洁。DataTables/Bootstrap 集成确保你可以使用所有这些功能，以及 DataTables 对纯 HTML 表格所做的增强。

安装

包含适用于 DataTables 及其扩展的 Bootstrap 4 集成的最简单方式是使用 DataTables 下载构建器。这是一个即点即用的界面，让你可以选择你希望使用的样式和软件。

下载构建器有将所需文件托管在 DataTables CDN、下载可在本地托管的软件包或使用 NPM 等包管理器等选项。

手动安装

如果你希望使用 DataTables Git 仓库或下载包，而不是 下载构建器，DataTables 及其所有扩展共享类似的文件命名约定，可用于包含所需的文件。

DataTables

主要的 DataTables 文件名为 dataTables.js。DataTables 支持的各种样式库还有一个样式集成文件，格式为 dataTables.{style}.js（例如，Bootstrap 4 为 dataTables.bootstrap4.js）。

应包含这两个 Javascript 文件 - 主文件以包含基本 DataTables 功能，样式文件以根据样式库设置默认值。

对于仅限于 CSS 的表，应仅包含一个文件，因为样式库将提供表的核心样式选项。CSS 文件格式为 dataTables.{style}.css（例如，Bootstrap 4 为 dataTables.bootstrap4.css）。

扩展

上面描述的文件命名约定也适用于 扩展。

对于 Javascript，我们有：dataTables.{extension}.js 和 {extension}.{style}.js - 例如，对于 Buttons，需要引入的文件为 dataTables.buttons.js 和 buttons.bootstrap4.js - 再次引入核心库，也引入了样式文件来设置适当的默认值。

针对 CSS，只需引入一个文件 - 所用样式相对应文件 - {extension}.{ style}.css - 例如 buttons.bootstrap4.css。

请注意，并非所有扩展均要求 Javascript 和 / 或 CSS 样式库。如果样式库未出现在存储库或包中，则它们不是必须的。

详情

如果您对 DataTables 文件命名约定感兴趣，请参考 此技术说明。

示例

一个由 Bootstrap 设置样式的 DataTable 的示例 此处可用。