列合并和列宽度固定:

  .setWidth {
table-layout: fixed;
} .setWidth > thead > tr > th {
width: 80px;
}
<table class="setWidth" id="EstateTable" data-mobile-responsive="true">
<colgroup>
<col style="width:36px;" />
<col style="width:17%" />
<col style="width:48px;" />
<col style="width:60px;" />
<col style="width:12%;" />
@*<col style="width:7%;" />
<col style="width:7%;" />*@
<col style="width:6%;" />
<col style="width:144px;" />
<col style="width:48px;" />
<col style="width:48px;" />
<col style="width:6%;" />
<col style="" />
</colgroup>
<thead> <tr>
<th data-field="state" style="width:36px;" data-checkbox="true"></th>
<th data-field="EstateType" data-visible="false">盘源类型ID</th>
<th data-field="ID" data-visible="false">ID</th>
<th data-field="EstateName" data-formatter="nameFormatter">楼盘名称</th>
<th data-field="EstateTypeDisplay">类型</th>
<th data-field="Address" style="width:60px;" align="center">城区</th>
<th data-field="Developer">发展商</th> @*<th data-field="EstateModeDisplay">楼宇类型</th>*@
@*<th data-field="Area">占地面积</th>
<th data-field="ConstrctionArea">建筑面积</th>*@
@*<th data-field="ProjectProxyModeDisplay">代理类型</th>*@
<th data-field="RegisterName">跟进人</th>
<th data-field="RegisteDate">登记时间</th>
<th data-field="FollowLevelDisplay">评级</th>
<th data-field="BusinessCard" data-formatter="imgFormatter">名片</th>
<th data-field="AuthStatusDisplay" data-formatter="actionFormatter">状态</th>
<th data-field="operation" width="120px;" data-formatter="operateFormatter">操作</th> </tr>
</thead>
</table>

行合并:

$('#EstateTable').bootstrapTable({
url: '/table/tableStyle',
method:'post',
pagination: true, //分页
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: 10, //每页的记录行数(*)
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
search: false, //显示搜索框
sidePagination: "server"
       onLoadSuccess: function (data) {
        $('#EstTable').bootstrapTable('mergeCells', {index: 1, field: 'name', rowspan: 3});
        }
    });

bootstrap-table 行合并和列合并,以及固定列宽度等问题的更多相关文章

  1. 当ligerui的grid出现固定列与非固定列不在同一水平线上时,改怎么处理

    当ligerui的grid出现固定列与非固定列不在同一水平线上时,如下图所示: 此时可以增加fixedCellHeight:false属性进行解决.这个属性在IE上不起作用,那么该怎么处理,可以这样处 ...

  2. rowStyle设置Bootstrap Table行样式

    日常开发中我们通常会用到隔行变色来美化表格,也会根据每行的数据显示特定的背景颜色,如果库存低于100的行显示红色背景 CSS样式 <style> .bg-blue { background ...

  3. bootstrap table 行号 显示行号 添加行号 bootstrap-table 行号

    思想:借助bootstrap-table 本身的index属性, 巧妙的的通过formatter 实现 { field: 'Number', title: 'Number', formatter: f ...

  4. Bootstrap table 行编辑导航

    /*开启表格编辑方向键导航 方向键(←): VK_LEFT (37) 方向键(↑): VK_UP (38) 方向键(→): VK_RIGHT (39) 方向键(↓): VK_DOWN (40) */ ...

  5. bootstrap table dataView展开行详情,p元素自动换行

    // bootstrap table 行详情展开,p元素自动换行1 .tableClass .detail-view p{ white-space: normal; }

  6. table固定前两列和最后一列,其他滑动显示

    网上搜的基本都是4个table做的,数据处理比较麻烦,写了个一个table的,此示例只固定了前两列和最后一列,和网上的不太一样. 网上搜的基本都是4个table做的,数据处理比较麻烦,写了个一个tab ...

  7. table中tr间距的设定table合并单元格 colspan(跨列)和rowspan(跨行)

    table中的tr的默认display:table-row,虽然可以修改为display:block但是就失去了tr特有的显示效果,如(td自动对齐): 并且在tr中对起设定padding是有用的,可 ...

  8. Js 合并 table 行 的实现方法

    Js 合并 table 行 的实现方法 需求如下: 某公司的员工档案,如下,  经理看员工的信息不是很清晰: 姓名 所在学校 毕业时间 张三 小学 2000 张三 中学 2006 张三 大学 2010 ...

  9. Table行合并操作

    此方法不可取,但几天心血 保留,已有新想法,稍后会出一个完善的Table行列合并方法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...

随机推荐

  1. 【HDOJ6299】Balanced Sequence(贪心)

    题意:给定n个只有左右括号的序列,要求将它们重新排序使得匹配的括号对数最大. n<=1e5 s[i]<=1e5 sum s[i]<=5e6 思路: 先把每个串内部的匹配数量减去,剩下 ...

  2. 运行hadoop自带的计算圆周率异常

    运行hadoop2 自带的圆周率计算方法时,报错,找了半天,原来是在配置hadoop临时目录时,没有给权限,找到配置的hadoop临时目录文件夹,修改权限即可 Application applicat ...

  3. 2014 蓝桥杯 预赛 c/c++ 本科B组 第九题:地宫取宝(12') [ dp ]

      历届试题 地宫取宝   时间限制:1.0s   内存限制:256.0MB     锦囊1   锦囊2   锦囊3   问题描述 X 国王有一个地宫宝库.是 n x m 个格子的矩阵.每个格子放一件 ...

  4. Heredoc和Nowdoc

    就象heredoc结构类似于双引号字符串,Nowdoc结构是类似于单引号字符串的.Nowdoc结构很象heredoc结构,但是 nowdoc不进行解析操作 . 这种结构很适合用在不需要进行转义的PHP ...

  5. ***apache做301重定向的方法

    将不带www的定向到带www去 方法一:加在httpd.conf 1.这里我使用mod_rewrite重写URL的方式来做,做之前朋友记得检查一下你的apache是否已经加载了rewrite模块.如图 ...

  6. ZOJ 3471 【状态压缩DP】

    题意: 有n种化学物质,他们彼此反应会有一种消失并释放出能量. 给出矩阵,第i行j列代表i和j反应j消失释放的能量. 求最大释放多少能量. 思路: 状态压缩DP,我是这么想的. 利用二进制0代表该物质 ...

  7. 第五讲:使用html5中的canvas动态画出物理学上平抛运动

    <html> <head> <title>平抛运动</title> <script src="../js/jscex.jscexRequ ...

  8. Java第二次作业參考代码

    Java第二次作业參考代码 [程序11] 题目:有1.2.3.4四个数字,能组成多少个互不同样且无反复数字的三位数?都是多少? public class lianxi11 { public stati ...

  9. LeetCode 283 Move Zeroes(移动全部的零元素)

    翻译 给定一个数字数组.写一个方法将全部的"0"移动到数组尾部.同一时候保持其余非零元素的相对位置不变. 比如,给定nums = [0, 1, 0, 3, 12],在调用你的函数之 ...

  10. C++卷积神经网络实例:tiny_cnn代码具体解释(6)——average_pooling_layer层结构类分析

    在之前的博文中我们着重分析了convolutional_layer类的代码结构.在这篇博文中分析相应的下採样层average_pooling_layer类: 一.下採样层的作用 下採样层的作用理论上来 ...