通过css样式给表格tbody加垂直滚动条
tbody加滚动条实现思路:
1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto。
2,把thead的tr设置成display:block。
3,因为都设置成block所以要给td手动添加宽度。
4,考虑到 tbody 产生了滚动条,这时会影响tbody以及thead的宽度,可以采用针对tbody设置::-webkit-scrollbar进行解决。
代码实现:
.table thead tr {
display:block;
}
.table tbody {
display: block;
height: 100px;
overflow: auto;
}
.table th {
width:%;
}
.table td {
width:%;
}
通过css样式给表格tbody加垂直滚动条的更多相关文章
- 怎么给tbody加滚动条?通过css样式给表格tbody加垂直滚动条
tbody加滚动条实现思路: 1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto. 2,把thead的tr设置成display:block. ...
- 给tbody加垂直滚动条的具体思路
[给tbody加垂直滚动条的具体思路] 给tbody加垂直滚动条的思路就是把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto即可 参考:http ...
- 11种常用css样式之表格和定位样式学习
table表格中border-collapse: collapse;/*表格边框是否合并*/border-spacing: 10px;/*表格边框之间的距离*/定位详情可以阅读position属性值4 ...
- Bootstrap表格中,thead固定,tbody有垂直滚动条
1.html源码:这里的table是使用的vue写法,实际生成的表格和一个一个写的tr th td无异 <div class="panel-body no-padding"& ...
- Bootstrap全局CSS样式之表格
.table--基础表格样式. .table-striped--给<tbody>之内的每一行添加斑马条纹样式: .table-bordered--为表格添加边框: .table-hover ...
- CSS样式之表格,表单
布局样式 .container:固定宽度并具响应式 .container-fluid自由宽度(100%宽度) 标题样式 <h1>到<h6> 样式已经写好了,可以直接用,兼容性也 ...
- CSS样式—— 字体、元素的垂直水平居中
1.CSS样式与HTML中标签属性的区别: 标签的属性是采用 属性名=“属性值” 表示的 CSS样式是采用名值对 属性名:属性值: 表示的 2.内联元素(行内元素)与块元素 (1)内联元素及其特点: ...
- Bootstarp--全局CSS样式之表格
表格在实际开发中可以说是非常常见的,但是有很多人不喜欢使用表格,但个人觉得在简单的界面布局中使用表格还是很简单的.毕竟人家给了表格这元素,而你却不去使用,貌似有点不解风情. 下面简单介绍Bootstr ...
- 笔记:1.css样式,最前边加 @charset "utf-8";是为什么2.js判断各种浏览器的方法
表明CSS文件的页面编码为UTF-8..如果这个CSS的文件编码也是UTF-8的话..那么在浏览器中看到的CSS文件的页面中中文的注释或者中文字体就可以正确显示为中文,如果CSS的文件编码和页面不一致 ...
随机推荐
- JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)
1.执行机制 JS 是单线程的,处理 JS 任务(程序)只能一个一个顺序执行,所以 JS 中就把任务分为了同步任务和异步任务.同步的进入主线程先执行,异步的进入Event Table并注册函数,当指定 ...
- 洛谷 P4570 BZOJ 2460 [BJWC2011]元素
Time limit 20000 ms Memory limit 131072 kB OS Linux 解题思路 看题解可知 我们将矿石按照魔法值降序排序,然后依次将矿石编号放入线性基(突然想起线代里 ...
- 关联规则挖掘--Apriori算法
- ASCII,Unicode,UTF-8
ASCII ASCII(American Standard Code for Information Interchange,美国信息交换标准代码)是基于拉丁字母的一套电脑编码系统,主要用于显示现代英 ...
- E. Natasha, Sasha and the Prefix Sums
http://codeforces.com/contest/1204/problem/E 给定n个 1 m个 -1的全排 求所有排列的$f(a) = max(0,max_{1≤i≤l} \sum_{j ...
- D2. Remove the Substring (hard version)
D2. Remove the Substring (hard version) 给字符串s,t,保证t为s的子序列,求s删掉最长多长的子串,满足t仍为s的子序列 记录t中每个字母在s中出现的最右的位置 ...
- idea中svn代码冲突
1.鼠标右键点击项目根目录 --> 2.选择 subversion --> 3.resolve Text Confict --> 4.merge 手动编辑冲突部分,解决后就能正常提交 ...
- cefsharp 在高DPI下闪烁的问题
今天有客户朋友说程序在他的surface下界面很闪烁,搜索了相关的资料,初步判定是DPI引起的问题,但也有可能是cefsharp 51版本在WIN10上面没有禁用GPU加速,苦于没有环境测试,所以抱着 ...
- 阶段1 语言基础+高级_1-3-Java语言高级_1-常用API_1_第1节 Scanner类_3-Scanner的使用步骤
Scanner如何进行键盘输入,引用类型就包含了Scanner,它就是引用类型,所以也有这三个步骤, 导包.创建.使用 先通过api文档找到它.左边输入要查找scanner.双夹scanner右边就会 ...
- JsonDatetime
ToDatetime public DateTime JsonDateTimeConvert(string time) { //try //{ if (String.IsNullOrEmpty(tim ...