table给tbody设置滚动条
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设置滚动条的更多相关文章
- CSS 设置table下tbody滚动条
table tbody { display:block; height:195px; overflow-y:scroll; } table thead, tbody tr { display:tabl ...
- CSS设置table下tbody滚动条与thead对齐的方法
<style>table tbody {display:block;height:195px;overflow-y:scroll;} table thead, tbody tr {disp ...
- 纯CSS,table的thead固定,tbody显示滚动条
以下代码,仅在谷歌下测试过 首先是html的table的代码: <table class="tablediv" id="myTable" border=& ...
- table下tbody滚动条与thead对齐的方法且每一列可以不均等
1 前言 table下tbody滚动条与thead对齐的方法,开始在tbody的td和thead的tr>td,对每一个Item加入百分比,结果是没对齐.也尝试了用bootstrap的col-md ...
- Html - Table 表头固定和 tbody 设置 height 在IE不起作用的解决
原文地址,转载请注明出处:http://www.cnblogs.com/jying/p/6294063.html 做项目的时候发现给 tbody设置 height 和 overflow-y 在IE下不 ...
- table表格,让thead固定,tbody有滚动条,关键是都对齐的纯css写法。
找了好久才找到一篇可以简单粗暴就能用的,所以拿过来算是收藏了.里面有一个css2里的命令是我没用过的也是这里面关键的:table-layout:fixed; 原理很简单,有爱研究的童鞋可以去css官网 ...
- 怎么给tbody加滚动条?通过css样式给表格tbody加垂直滚动条
tbody加滚动条实现思路: 1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto. 2,把thead的tr设置成display:block. ...
- webkit浏览器css设置滚动条
主要有下面7个属性: ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scroll ...
- CSS设置滚动条样式
因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决. 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的.如图所示: ...
随机推荐
- yum 安装 jenkins
环境:已安装 tomcat 安装(如果yum下载速度比较忙可以下载下来再安装) yum -y install https://pkg.jenkins.io/redhat/jenkins-2.77-1. ...
- zabbix 创建监控项
项目是在Zabbix收集数据的基础 ,所有项目都是围绕主机,找到创建的主机 点击 Configuration > hosts > ltems 点击 Create item Name:输入C ...
- linux上 安装软件
一.rpm包安装方式步骤: 1.找到相应的软件包,比如soft.version.rpm,下载到本机某个目录: 2.打开一个终端,su -成root用户: 3.cd soft.version.rpm所 ...
- Android Developers:传感器概述
大 多数Android设备有内置的传感器,来测量运动,方向和各种环境条件.这些传感器能提供高精度和准确度的原始数据,如果你想监控设备三维运动或者位 置,或者你想监控设备周围的环境变化,是非常有用的.例 ...
- 关于Revit API修改元素参数的问题?
>ADN: DEVR3894 >ADN service level: Professional >产品:Revit MEP 2012 >版本:2012 >语言:中 ...
- AngularJS中的ng-controller是什么东东
在AngularJS中,ng-controller是最常用的directive.比如: var app = angular.module("app",[]); app.contro ...
- .NET 开源开发项目【翻译】
原文地址 本文列出了 .NET 开源开发项目(open source developer projects).意在包括对开发过程的所有方面有所帮组的项目.对于消费项目(consumer project ...
- SQL列类型
列类型的几种基本规则 M:表示最大显示宽度,最大有效显示宽度255 D:适用于浮点和定点类型,表示小数点后面的位数 方括号: [],表示可选部分 如果为一个数值列指定ZEROFILL,MySQL自动为 ...
- Grails 第一课
package helloworld import org.junit.*; import java.util.*; class HelloController { def index() { //d ...
- 快捷切换hosts的小工具:SwitchHosts!
Windows 绿色版本下载:http://oldj.github.io/SwitchHosts/. 日常开发工作中,我们可能经常需要切换各种 hosts 绑定,比如在本地开发时可能需要一个开发环境的 ...