Rumah > hujung hadapan web > tutorial js > jQuery Datatables表头不对齐的解决办法

jQuery Datatables表头不对齐的解决办法

小云云
Lepaskan: 2017-12-07 15:57:12
asal
2381 orang telah melayarinya

我们用Datatables经常会遇到这种情况,就是浏览器或者HTML里元素改变大小或分辨率后,标题就会出现不对齐现象。这种情况是因为Datatables框架中使用到serverSide : true,// 服务器查询数据属性,它会使Table标签中多一个style="width:**px;"属性,这就导致了变化大小时标题对不齐现象。本文我们主要给大家分享jQuery Datatables表头不对齐的解决办法,希望能帮助到大家。


<table id="example" class="table table-border table-bordered table-bg table-hover table-sort"> 
 <thead> 
 <tr class="text-c"> 
  <th width="25"> 
  <input type="checkbox" name="checkAll" class="checkall" onclick="checkedClean();"> 
  </th> 
  <th width="100">名称</th> 
  <th width="100">说明</th> 
  <th width="100">类型</th> 
  <th width="60">是否默认</th> 
  <th width="20">状态</th> 
  <th width="100"></th> 
 </thead> 
 <tbody> 
 </tbody> 
</table>
Salin selepas log masuk


解决方法


#example{ 
 width: 100% !important; 
}
Salin selepas log masuk


如果遇到设有横向滚动条时,就固定设置Table宽度


#example{ 
 width: ***px !important; 
}
Salin selepas log masuk


收工,这样就完美解决了!!

相关推荐:

jquery插件datatables属性介绍及创建分页、排序实例详解

jQuery datatables是什么?datatables如何使用?

jquery+php实现导出datatables插件数据到excel的方法,jquerydatatables_PHP教程

Atas ialah kandungan terperinci jQuery Datatables表头不对齐的解决办法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan