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

 更新时间:2017年11月27日 14:55:42   作者:BugsCode  
这篇文章主要为大家详细介绍了jQuery Datatables表头不对齐的解决办法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

我们用Datatables经常会遇到这种情况,就是浏览器或者HTML里元素改变大小或分辨率后,标题就会出现不对齐现象。这种情况是因为Datatables框架中使用到serverSide : true,// 服务器查询数据属性,它会使Table标签中多一个style="width:**px;"属性,这就导致了变化大小时标题对不齐现象。

<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> 

解决方法

#example{ 
 width: 100% !important; 
} 

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

#example{ 
 width: ***px !important; 
} 

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • jQuery实现向下滑出的二级菜单效果实例

    jQuery实现向下滑出的二级菜单效果实例

    这篇文章主要介绍了jQuery实现向下滑出的二级菜单效果,涉及jquery鼠标事件及页面元素样式动态变换的相关技巧,非常具有实用价值,需要的朋友可以参考下
    2015-08-08
  • Jquery常用技巧收集整理篇

    Jquery常用技巧收集整理篇

    jQuery 1.4给开发者带来了很多值得兴奋的新特性,同时使用jQuery的人也越来越多,为了方便大家对jQuery的使用,下面列出了一些jQuery使用技巧。
    2010-11-11
  • jQuery多级联动下拉插件chained用法示例

    jQuery多级联动下拉插件chained用法示例

    这篇文章主要介绍了jQuery多级联动下拉插件chained用法,结合实例形式分析了jQuery多级联动下拉插件chained的功能与基本使用技巧,需要的朋友可以参考下
    2016-08-08
  • jquery photoFrame 图片边框美化显示插件

    jquery photoFrame 图片边框美化显示插件

    jquery.photoFrame是很方便的一个相框插件,原理也很简单,将选定对象用九宫格table包裹,再设置其边框的背景图片即可。
    2010-06-06
  • jQuery判断iframe中元素是否存在的方法

    jQuery判断iframe中元素是否存在的方法

    jQuery判断iframe中元素是否存在的方法,需要的朋友可以参考一下
    2013-05-05
  • jQuery中:selected选择器用法实例

    jQuery中:selected选择器用法实例

    这篇文章主要介绍了jQuery中:selected选择器用法,实例分析了:selected选择器的功能、定义及匹配被选择的<option>元素的使用技巧,需要的朋友可以参考下
    2015-01-01
  • jQuery获取样式中的背景颜色属性值/颜色值

    jQuery获取样式中的背景颜色属性值/颜色值

    天使用jQuery获取样式中的background-color的值时发现在获取到的颜色值在IE中与Chrome、Firefox显示的格式不一样,IE中是以HEX格式显示#ffff00,而Chrome、Firefox中则是以GRB格式显示rgb(255,0,0),由于需要将颜色值存储到数据库中,所以想让颜色值的格式统一下(其实不统一也是可以存的)。搜索了一下,从国外的一个网站上得到一段代码
    2012-12-12
  • 基于JQuery及AJAX实现名人名言随机生成器

    基于JQuery及AJAX实现名人名言随机生成器

    这篇文章主要为大家详细介绍了基于JQuery及AJAX实现名人名言随机生成器,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)

    jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)

    款Jquery+CSS3+Html5实现弹出层效果,应用范围很广泛,比如用在消息提示、弹出层显示内容、弹出层登录等,带遮罩效果,非常实用,对此功能感兴趣的朋友可以参考下本地代码
    2016-05-05
  • EasyUI Pagination 分页的两种做法小结

    EasyUI Pagination 分页的两种做法小结

    这篇文章主要介绍了EasyUI Pagination 分页的两种做法小结的相关资料,需要的朋友可以参考下
    2016-07-07

最新评论