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. 用面向对象计算BMI指数

    from __future__ import division class Student: def __init__(self,name,weight,height): self.name=name ...

  2. 在java中构建json对象,返回给前端页面

    // 给客户端返回一个json对象 StringBuilder sb = new StringBuilder("{"); sb.append("\"name\& ...

  3. Redis集群官方推荐方案 Redis-Cluster

    Redis-Cluster redis使用中遇到的瓶颈 我们日常在对于redis的使用中,经常会遇到一些问题 1.高可用问题,如何保证redis的持续高可用性. 2.容量问题,单实例redis内存无法 ...

  4. centos7 设置tomcat自启动

    1 .vi  /etc/init.d/tomcat8 #!/bin/bash # # tomcat startup script for the Tomcat server # # chkconfig ...

  5. MySQL实用工具汇总

    本文收录了mysql相关的实用工具.工具包括:性能测试,状态分析,SQL路由,及运维开发相关的所有工具,并会持续更新. 1.工具套件集 - percona-toolkit - oak-toolkit ...

  6. (转)热空气扭曲效果shader

    转自:http://blog.sina.com.cn/s/blog_89d90b7c0102vaqy.html 热空气扭曲在大自然中形成是比较复杂的,这里只是通过取屏幕纹理和移动UV来模拟热扭曲效果. ...

  7. Android apk签名的两种方法

    编辑推荐:稀土掘金,这是一个针对技术开发者的一个应用,你可以在掘金上获取最新最优质的技术干货,不仅仅是Android知识.前端.后端以至于产品和设计都有涉猎,想成为全栈工程师的朋友不要错过! 为了保证 ...

  8. webapi帮助文档swagger

    nuget安装Swashbuckle包 修改SwaggerConfig文件 //c.IncludeXmlComments(GetXmlCommentsPath()); //设置接口描述xml路径地址 ...

  9. .net跨平台分析软件

    https://marketplace.visualstudio.com/items?itemName=ConnieYau.NETPortabilityAnalyzer

  10. docker部署maven私有仓库 nexus3

    docker pull sonatype/nexus3: docker run -d --name nexus3.x --network host -v /volume-data/nexus3/nex ...