Question

我在网站上使用了数据表导出按钮（https://datatables.net/extensions/buttons/examples/html5/simple.html）但是在我的网站上我使用的是自定义字体系列。在我的主要CSS中，代码如下：

<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet">
<link href="css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
<link href="css/plugins/dataTables/buttons.dataTables.min.css" rel="stylesheet">

我使用的css文件如下：

<script src="js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script src="js/plugins/dataTables/dataTables.buttons.min.js"></script>
<script src="js/plugins/dataTables/buttons.flash.min.js"></script>
<script src="js/plugins/dataTables/jszip.min.js"></script>
<script src="js/plugins/dataTables/pdfmake.min.js"></script>
<script src="js/plugins/dataTables/vfs_fonts.js"></script>
<script src="js/plugins/dataTables/buttons.html5.min.js"></script>
<script src="js/plugins/dataTables/buttons.print.min.js"></script>

虽然附加的js文件如下：

.dt-button {
  font-family: MyFontCapital;
  src: url('../font/MyFontCapital.otf');
}

我想更改导出按钮使用的字体（CSV，Excel，PDF，打印）

我尝试在我的主要css上添加代码：

.dt-button-collection{
  font-family: MyFontCapital;
  src: url('../font/MyFontCapital.otf');
}

或

{{1}}

但没有奏效。我还搜索了datatables站点，但没有找到在数据表初始化期间设置font-family的任何示例。知道我应该做什么吗？

Answer 1

让你的风格定义更重要，例如。

.dt-button {
  font-family: MyFontCapital !important;
}

不需要.dt按钮样式中的src。

此外，在字体路径中还有一个额外的空格：

    font-family: MyFontSansMedium;
    src: url('../font/ MyFontSans-Medium.otf');

如何更改jquery数据表导出按钮的字体系列

1 个答案: