0

仅使用数据表

<div class="dataTables_scroll">
<div class="dataTables_scrollHead" style="overflow: hidden; position: relative; border: 0px none; width: 100%;">
<div class="dataTables_scrollHeadInner" style="width: 7548px; padding-right: 17px;">
<table class="display dataTable" cellspacing="0" cellpadding="0" border="0" style="margin-left: 0px; width: 7548px;">

使用引导程序后

<div class="dataTables_scroll">
<div class="dataTables_scrollHead" style="overflow: hidden; position: relative; border: 0px none; width: 7565px;">
<div class="dataTables_scrollHeadInner" style="width: 4401px; padding-right: 17px;">
<table class="display dataTable" cellspacing="0" cellpadding="0" border="0" style="margin-left: 0px; width: 4401px;">

所以我不得不恢复以前的css。我还需要引导程序，因为还有其他依赖于它的 css，但引导程序也更改了数据表的 CSS。临时解决方案是

$('.dataTables_scrollHead').css('width','100%');
$('.dataTables_scrollHeadInner').css('widht','7548');
$('.dataTable, .display').css('width','7548');

有什么解决方案可以让引导程序不会触及我的数据表 CSS 吗？谢谢 ！！！

4

2 回答 2

0

如果您使用的是 Bootstrap 3，我在博客中写了一些修改可能会有所帮助：

http://devblog.rayonnant.net/2013/09/bootstrap-3-datatables-paging.html

我的示例基于 datatables.net 网站上的 Bootstrap 2 修改，只是修改为使用 Bootstrap 3 的 CSS 和表单结构。

于 2013-09-19T21:42:47.297 回答
0

更好的解决方案被赋予了数据表的唯一类名并对其进行自定义，

按照这个：

  1. 不要使用 3000px 宽度或其他东西，使用百分比测量。这样可以实现响应性行为。
  2. 最大限度地避免内联 CSS 样式。
于 2019-08-07T07:13:28.543 回答