table-layout:fixed;可以自定义列的宽度

<div id="bizhi" style="width:100%;height: 85%;overflow-x: auto;">
                        <table id="data_table" class=""  style="width:100%;height: 100%;table-layout:fixed;font-size: 0.2rem !important;">
                                <thead>
                                    <tr>
                                        <!--<th rowspan="2" style="width: 5px !important;">序号</th>-->
                                        <!--<th rowspan="2" style="width: 120px !important;">供热站</th>
                                        <th colspan="5" style="width: 270px !important;">消耗指标</th>-->
                                        <th rowspan="2" style="width: 36% !important;">供热站</th>
                                        <th colspan="5" style="width: 64% !important;">消耗指标</th>
                                    </tr>
                                    <tr>
                                        <th>氧化钙</th>
                                        <th>NaOH溶液</th>
                                        <th>NaOH片碱</th>
                                        <th>尿素</th>
                                        <th>工业盐</th>
                                    </tr>
                                </thead>
                        </table>
                    </div>

//tab切换时会使表头元素宽度无法识别,先设置一个定时器,刚开始让所有的table的div都显示,在页面打开若干秒或者毫秒之后,让不该显示的div隐藏就好了hide(),
        setTimeout(function(){$("#changzhi").hide()},1000)

关于datatables自适应以及自定义列宽度的总结的更多相关文章

  1. easyui datagrid标题列宽度自适应

    最近项目中使用easyui做前端界面,相信大部分使用过easyui datagrid的朋友有这么一个疑问:如果在columns中不设置width属性能不能写个方法让datagrid的头部标题和数据主体 ...

  2. html - table 表格不被撑开,td某些列宽度固定某些列自适应

    table-layout 属性的解释:http://www.w3school.com.cn/cssref/pr_tab_table-layout.asp 1,实现table细边框,设置如下css: t ...

  3. CSS 布局实例系列(三)如何实现一个左右宽度固定,中间自适应的三列布局——也聊聊双飞翼

    今天聊聊一个经典的布局实例: 实现一个三列布局,其中左侧和右侧的部分宽度固定,中间部分宽度随浏览器宽度的变化而自适应变化 可能很多朋友已经笑了,这玩意儿通过双飞翼布局就能轻松实现.不过,还请容我在双飞 ...

  4. CSS实现两列布局,一列固定宽度,一列宽度自适应方法

    不管是左是右,反正就是一边宽度固定,一边宽度自适应. 博客园的很多主题也是这样设计的,我的博客也是右侧固定宽度,左侧自适应屏幕的布局方式. html代码: <div id="wrap& ...

  5. 使用CSS实现三栏自适应布局(两边宽度固定,中间自适应)

    来源:http://blog.csdn.net/cinderella_hou/article/details/52156333 所谓三列自适应布局指的是两边定宽,中间block宽度自适应.这道题在今年 ...

  6. Fiddler扩展——自定义列数据&Tunnel to 443解决办法

    在平时日常工作中,使用Fiddler的占比还是蛮大的.使用过程,也会遇到一些小问题,问题虽小,但抓不到包,分析不了问题与数据,那也是件麻烦的事情. 以前也分享过一些小技巧,可以找以前的博文查看,具体地 ...

  7. DatagridView自动充满屏幕,并能指定某列宽度

    1.要使datagridview正好充满屏幕,设置其AutoSizeColumnsMode属性为fill 2. 同时,我们想要某列宽点,某列窄点,在AutoSizeColumnsMode属性为fill ...

  8. EasyUI Datagrid 自定义列、Foolter及单元格编辑

    1:自定义列,包括 Group var head1Array = []; head1Array.push({ field: 'Id', title: 'xxxx', rowspan: 2 }); he ...

  9. DevExpress ASP.NET 使用经验谈(8)-ASPxGridView自定义列和基本事件

    为演示本节示例,我们在原来Users表增加[性别Gender].[兴趣爱好Hobbies],[CreateTime创建时间],[ModifyTime]修改时间这4个字段, ALTER TABLE [d ...

随机推荐

  1. Python 内置函数sorted()在高级用法

    对于Python内置函数sorted(),先拿来跟list(列表)中的成员函数list.sort()进行下对比.在本质上,list的排序和内建函数sorted的排序是差不多的,连参数都基本上是一样的. ...

  2. python基础:re模块匹配时贪婪和非贪婪模式

    python贪婪和非贪婪 正则表达式通常用于在文本中查找匹配的字符串.Python里数量词默认是贪婪的(在少数语言里也可能是默认非贪婪),总是尝试匹配尽可能多的字符:非贪婪则相反,总是尝试匹配尽可能少 ...

  3. django 分页函数

    实现类似: 上一页 1 ... 4 5 7 8 ... 89 下一页 的效果 def pageGenerate(fullList,pagenum,urltype,type,currpage): pag ...

  4. golang fatal error: all goroutines are asleep - deadlock!

    转自:https://www.cnblogs.com/ghj1976/p/4295013.html http://blog.csdn.net/skh2015java/article/details/6 ...

  5. div容器中内容垂直居中

    #box{ width:200px; height:200px; line-height: 200px; vertical-align: middle; margin: 5px; background ...

  6. AMQP 0.9.1和1.0协议差别以及rabbitmq支持情况

    RabbitMQ implements AMQP 1.0 via a plugin. However, AMQP 1.0 is a completely different protocol than ...

  7. Angular 请求数据

    Angular 请求数据 get post 以及 jsonp 请求数据 引入 HttpModule .JsonpModule 普通的 HTTP 调用并不需要用到 JsonpModule,不过稍后我们就 ...

  8. PO VO BO DTO POJO DAO之间的关系

    J2EE开发中大量的专业缩略语很是让人迷惑,尤其是跟一些高手讨论问题的时候,三分钟就被人家满口的专业术语喷晕了,PO VO BO DTO POJO DAO,一大堆的就来了. PO:persistant ...

  9. ubuntu上解决访问github慢的方法

    1.进入终端命令行模式,输入sudo vi /etc/hosts 2.输入i进入编辑命令,英文输入法输入G,vim编辑器跳到hosts文件的最后一行 3.用浏览器访问 IPAddress.com 使用 ...

  10. CentOS7下Docker中构建可以自动发布到项目的Tomcat容器

    步骤 下载镜像 搜索相应的镜像文件:docker search 'tomcat' 如下 下载镜像:docker pull tomcat:7,如下图 PS:后面的数字代表tomcat的版本,可以自己选择 ...