直觉的感受是修改thead与tbody,尝试了以下几种方法,但均告失败。 
1. 将tbody设置为块状元素,然后设置表格的高度与溢出; 
1. 将thead设置为绝对定位,然后设置表格的高度与溢出; 
1. 将表格转换为块状元素,然后把有td都设置为浮动,从而控制高度与溢出;

正确的方法应该将   thead和 tbody都用div装起来:

效果如下图:

  

table固定头部,tbody内容滚动的更多相关文章

  1. table固定头部,表格tbody可上下左右滑动

    当表格头部固定时,需要分为两个表格来做:一部分是thead,一部分是tbody,具体实现方式如下: html代码: <div class="table_box_big"> ...

  2. bootstrap table 实现固定悬浮table 表头并可以水平滚动

    在开发项目中,需要将表格头部固定,而且表格大多数情况下是会水平滚动的.项目的css框架是bootstrap 3,故也可以叫做bootstrap table. 需要实现的是:表格头部固定,并且支持水平滚 ...

  3. div+css实现表头固定内容滚动表格

    <div class="m-demo"> <table> <thead> <tr><th>定宽a</th>& ...

  4. Css 设置固定表格头部,内容可滚动

      效果图:

  5. 固定Table的头部和左边的列-在Knockout Js使用场景下

    要求:固定Table的头部和左边的列 场景:Knockout Js被用于绑定Table的数据源. 固定HTML表格的头部和列是一个很常见的需求.此文:http://www.cnblogs.com/so ...

  6. HTML table固定表头

    最近尝试了几种HTML的table固定表头的方法..额...各有利弊,但很尴尬..... 1.thead和tbody的display设置为block; 这种可以实现,但是需要提前设置好每个th和td的 ...

  7. Midnight.js – 实现奇妙的固定头部切换效果

    Midnight.js 是一款 jQuery 插件,在页面滚动的时候实现多个头设计之间的切换,所以你总是有一个头与它下面的内容层叠,看起来效果很不错. Midnight.js 可以让你轻松实现这种切换 ...

  8. Bootstrap表格中,thead固定,tbody有垂直滚动条

    1.html源码:这里的table是使用的vue写法,实际生成的表格和一个一个写的tr th td无异 <div class="panel-body no-padding"& ...

  9. 移动端固定头部和固定左边第一列的实现方案(Vue中实现demo)

    最近移动端做一份报表,需要左右滚动时,固定左边部分:上下滚动时,固定头部部分. 代码在Vue中简单实现 主要思路是: a.左边部分滚动,实时修改右边部分的滚动条高度 b.头部和内容部分都设置固定高度, ...

随机推荐

  1. 003_C/C++笔试题_分享大汇总

    (一)感谢:lhzstudio 01_C++经典面试题全集 50~100道 都附带有参考答案 02_C++开发工程师面试题库 100~150道 03_C++笔试题库之编程.问答题 150~200道 0 ...

  2. kernel namespace

    reference: https://lwn.net/Articles/531114/

  3. bzoj3508: 开灯

    题目链接 题解 设\(b[i]=a[i]\ xor\ a[i+1]\) 我们可以发现,修改只会改变\(b[l-1]\)和\(b[r]\) 然后发现\(b[i]=1\)的点最多\(2*k\)个 状压\( ...

  4. webstorm双击鼠标出现光标块

    将Vim 选项对勾去掉

  5. c语言中sprintf()函数中的%使用

    #include <stdio.h> #include <string.h> int main() { ] = {}; ] = {}; ] = {}; /*打印2个%*/ st ...

  6. vue中插槽(slot)的使用

    刚学vue的时候,曾经学习过slot插槽的使用,但是后面接触的不多,因为之前我还没使用element-ui... 但是使用了element-ui之后,里面的许多组件,有时候会使用插槽,为了巩固一下插槽 ...

  7. MySQL备忘点(下)

    联结表 创建联结 FROM 表1,表2 与内连接作用相同类似:如果失去WHERE子句,会出现笛卡尔积现象 内联结 INNER JOIN 高级联结 自联结 例子:SELECT 字段b FROM 表 WH ...

  8. VSCode-VUE模板文件

    编辑自己的代码片段 ctrl+shift+p 输入snippet 选择 'Preferences: Configure User Snippets' 输入vue 选择vue.json,会打开vue.j ...

  9. 树莓派中将caplock映射为esc键

    据说,喜欢vimer都呵caplock有仇,明明caplock占着原来esc的位置,却从来没有起到应有的作用,你说气人吗,没关系,我改啊:将下面语句加入到.bashrc中,启动即可xmodmap -e ...

  10. Ubuntu验证查看库的安装情况

    以下是ubuntu系统安装完成一些库后,验证查看各个库的安装情况. 1. CUDA8.0 yuanlibin@yuanlibin:~$ nvcc -V nvcc: NVIDIA (R) Cuda co ...