如何修复Datatables CSS不适用于Datatables？

Question

我一直在尝试从datatables.net包含一个Datatable，它工作正常，分页，排序和搜索栏工作正常，但是datatables css文件不适用于该Datatable（它看起来很旧而且很时髦，不是（它在datatables.net中的显示方式）。我使用tabler.io作为Web应用程序的模板，它使用Bootstrap 4.3.1。

这些是我正在使用的css和js文件：

<link href="{{ asset('css/app.css') }}" rel="stylesheet"> //bootstrap 4.3.1
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

Answer 1

您可以使用Datatables Theme Creator添加自定义样式。

1. 在页面顶部选择样式选项

2. 单击“创建样式表”

3. 点击页面底部的“ CSS”标签，然后将其复制并粘贴到CSS文件中。

我发现主题创建者虽然有点讨厌使用。我发现更有用的是您复制并粘贴到CSS文件中后输出的CSS，可以根据您的特定需求进行操作。

尽管有很多CSS输出，所以这可能是一个问题。我建议将其放在CSS文件的底部，以免超过350种样式的样式妨碍您使用其他CSS。