table结构例子:

<table class="layui-table">
<thead>
<tr>
<th>
贷款项目
</th>
<th>
贷款类型
</th>
<th>
所属公司
</th>
<th>
产品联系人
</th>
<th>
是否上线
</th>
<th>
联系电话
</th>
<th>
点击量(详情)
</th>
<th>
访问量(详情)
</th>
<th>
点击量(申请)
</th>
<th>
访问量(申请)
</th>
<th>
点击量(子页面)
</th>
<th>
访问量(子页面)
</th>
</tr>
</thead>
<tbody id="x-img">
</tbody>
<tfoot>
<tr style="background: #f2f2f2;">
<td >总计:</td>
<td align="center">——</td>
<td align="center">——</td>
<td align="center">——</td>
<td align="center">——</td>
<td align="center">——</td>
<td class="djCount1"></td>
<td class="fwCount1"></td>
<td class="djCount"></td>
<td class="fwCount"></td>
<td class="djCount3"></td>
<td class="fwCount3"></td>
</tr>
</tfoot>
</table>

css如下:

table tbody {
display:block;
max-height:500px;
overflow-y:scroll;
overflow-x:hidden;
}
::-webkit-scrollbar {
width: 1px;
}
table thead,tbody tr,tfoot tr,thead tr {
display:table;
width:100%;
table-layout:fixed;
}

table给tbody设置滚动条的更多相关文章

  1. CSS 设置table下tbody滚动条

    table tbody { display:block; height:195px; overflow-y:scroll; } table thead, tbody tr { display:tabl ...

  2. CSS设置table下tbody滚动条与thead对齐的方法

    <style>table tbody {display:block;height:195px;overflow-y:scroll;} table thead, tbody tr {disp ...

  3. 纯CSS,table的thead固定,tbody显示滚动条

    以下代码,仅在谷歌下测试过 首先是html的table的代码: <table class="tablediv" id="myTable" border=& ...

  4. table下tbody滚动条与thead对齐的方法且每一列可以不均等

    1 前言 table下tbody滚动条与thead对齐的方法,开始在tbody的td和thead的tr>td,对每一个Item加入百分比,结果是没对齐.也尝试了用bootstrap的col-md ...

  5. Html - Table 表头固定和 tbody 设置 height 在IE不起作用的解决

    原文地址,转载请注明出处:http://www.cnblogs.com/jying/p/6294063.html 做项目的时候发现给 tbody设置 height 和 overflow-y 在IE下不 ...

  6. table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法。

    找了好久才找到一篇可以简单粗暴就能用的,所以拿过来算是收藏了.里面有一个css2里的命令是我没用过的也是这里面关键的:table-layout:fixed; 原理很简单,有爱研究的童鞋可以去css官网 ...

  7. 怎么给tbody加滚动条?通过css样式给表格tbody加垂直滚动条

    tbody加滚动条实现思路: 1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto. 2,把thead的tr设置成display:block. ...

  8. webkit浏览器css设置滚动条

    主要有下面7个属性: ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scroll ...

  9. CSS设置滚动条样式

    因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决. 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的.如图所示: ...

随机推荐

  1. 潭州课堂25班:Ph201805201 WEB 之 JS 第五课 (课堂笔记)

    算数运算符 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  2. [USACO11FEB]Generic Cow Protests

    思路: 动态规划.首先处理出这些数的前缀和$a$,$f_i$记录从第$1$位到第$i$位的最大分组数量.DP方程为:$f_i=max(f_i,f_j+1)$,其中$j$满足$a_i-a_j≥0$. # ...

  3. LVS 之ARP

    原理 工作过程 主机A的IP地址为:192.168.1.1  MAC地址为:0A-11-22-33-44-01: 主机B的IP地址为:192.168.1.2  MAC地址为:0A-11-22-33-4 ...

  4. Cocos Creator 的Hello World

    1,创建项目[参考来源:官方文档] 在 Dashboard 中,打开 新建项目 选项卡,选中 Hello World 项目模板. 然后在项目路径栏中指定一个新项目存放路径,路径的最后一部分就是项目文件 ...

  5. Delphi 开发ActiveX控件(非ActiveForm)

    Delphi 开发ActiveX控件(非ActiveForm) Q:为什么不采用ActiveForm工程?通过它可以快速开发带窗体控件,创建过程也非常简单(都不用考虑安全接口问题),很省事! A:如果 ...

  6. 解决无法安装Flash Player的问题

    1.同时搜索几个关键词:关键词用空格分开,例如:“中国 历史”会搜索显示同时包含中国.历史两个词的网页 2.排除某个关键词:被排除的词前面加上-号,例如“中国 历史 -清朝”会把有清朝两个字的网页过滤 ...

  7. Kafka与常见消息队列的对比

    Kafka与常见消息队列的对比 RabbitMQ Erlang编写 支持很多的协议:AMQP,XMPP, SMTP, STOMP 非常重量级,更适合于企业级的开发 发送给客户端时先在中心队列排队.对路 ...

  8. DNS的域名的解析解决办法(openDNS)

    http://www.williamlong.info/archives/1101.html

  9. Java的oauth2.0 服务端与客户端的实现

    oauth原理简述 oauth本身不是技术,而是一项资源授权协议,重点是协议!Apache基金会提供了针对Java的oauth封装.我们做Java web项目想要实现oauth协议进行资源授权访问,直 ...

  10. Visual Studio 2015 与 .NET 4.6 RTM 正式发布

    原文地址 微软终于正式发布了Visual Studio 2015产品家族的RTM版本,此次发布体现了微软在开发工具发展方向上的转变迈出了重要的一步,他们致力于提供一种支持在所有主流应用平台上进行应用开 ...