DataTables如何更改底部和顶部栏的高度和字体？

Question

数据表版本：1.10.12

我有一个DataTable，我想改变顶部和底部栏中显示的高度和字体，我在CSS中尝试了很多东西，使用firefox中的元素检查将各种设置应用到.datatables类，但它只是不会做任何事情。我想改变这个：

它对我来说太大了（高度）....我还想将行的高度更改为与它们内部的字母一样高，这样我就可以在屏幕上显示更多数据。

我该怎么做？也可以将页脚中的所有信息（显示等等等......和页面按钮，上一个/下一个按钮等）移动到标题本身？

Answer 1

很高兴看到你尝试过的东西，但我相信你忘了你正在使用jquery UI样式。 CSS中的目标.ui-button和.ui-toolbar以及标准.dataTables_wrapper CSS类：

/* change font in top and bottom */
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .ui-button {
  color: red;
  font-family: 'courier'
}

/* change "height" caused by exaggerated padding */
.dataTables_wrapper .ui-toolbar {
  padding: 0px;
}

<强> http://jsfiddle.net/rqm49duz/

Answer 2

也许您必须将!important用于CSS代码 第二个问题：
您可以使用dom选项。例如：

$('#example').dataTable( {
  "dom": '<"wrapper"flipt>'
} );

Read more...