table表头固定问题

原生的table表头在表格滚动时候无法固定,可以使用以下的方法进行模拟

1. 双table法

表头和表体各用一个table,这样会产生表格列对不齐的问题,可以使用colgroup和col来对齐,或者直接设置th,td的宽度

2. 单table修改样式方法

设置表格体为display:block,表格head和表格body的行都是display:table

.tb tbody{display:block;height:300px;overflow:hidden;overflow-y:scroll;}
.tb thead,.tb tbody tr{
display:table;width:100%;table-layout:fixed;
}

参考: https://blog.csdn.net/hualele/article/details/52993315
    https://blog.csdn.net/qq_36340642/article/details/79353179

table表头固定问题的更多相关文章

  1. HTML table表头固定

    HTML table表头固定 说说我在最近项目中碰到的css问题吧,作为问题知识集合总结笔记: <!DOCTYPE html> <html> <head> < ...

  2. 纯CSS实现table表头固定(自创备忘)

    因为之前约定时候产品没说要表头固定,这次迭代测试突然提出这个需求,而且不知道因为什么未知原因非要这样不可--因为之前用了table标签做表单,而且也没用插件,这下就难了点,找另外一个前端前辈妹子商量了 ...

  3. table 表头固定 thead固定. 1) 使用jquery.freezeheader.js

    方法一: 使用jquery.freezeheader.js 固定表头: 1-: 初始化: <!DOCTYPE html> <html lang="en"> ...

  4. jQuery,Table表头固定插件chromatable存在的问题及解决办法

    在最近的项目中需要将表格的表头固定,搜寻了大量的资料,发现chromatable插件还是比较方便的.但是当我在一个页面中多次使用 chromatable固定对个表格的表头时问题就出现了,首先说明系统的 ...

  5. table表头固定

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. table 表头固定

    <html> <head> <title>Test</title> <style type="text/css"> .d ...

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

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

  8. html5 table的表头固定的HTML代码

    table的表头固定的HTML代码 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...

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

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

随机推荐

  1. [原]解决phpstudy下的nginx无法运行的问题

    一直在用phpstudy下的apache,今天忽然想切换到nginx,出现了一些错误,最终还是解决了. 之前是php 5.3 + apache 现在是php 5.3n + nginx 问题就出在这n上 ...

  2. Python Web开发中,WSGI协议的作用和实现原理详解

    首先理解下面三个概念: WSGI:全称是Web Server Gateway Interface,WSGI不是服务器,python模块,框架,API或者任何软件,只是一种规范,描述web server ...

  3. linux文件IO操作篇 (二) 缓冲文件

    2. 缓冲文件操作 //规模较大 实时性低的文件 //当数据长度快要超过缓冲区的范围时,或者时间周期达到时,数据才被送往指定位置 //需要使用FILE * 作为文件标识符 //stdin 标准输入 / ...

  4. c语言中 *p++ 和 (*p)++ 和 *(p++) 和 *(++p) 和++(*p)和 *(p--)和 *(--p)有什么区别?

    *p++是指下一个地址; (*p)++是指将*p所指的数据的值加一; /******************解释**********************/ ->C编译器认为*和++是同优先级 ...

  5. go学习笔记-变量作用域

    变量作用域 作用域为已声明标识符所表示的常量.类型.变量.函数或包在源代码中的作用范围. 变量可以在三个地方声明: 函数内定义的变量称为局部变量 函数外定义的变量称为全局变量 函数定义中的变量称为形式 ...

  6. R语言绘图:在地图上绘制散点图

    使用ggplot2在地图上绘制散点图 ######*****绘制散点图代码*****####### options(baidumap.key = '**************') #设置密钥 bei ...

  7. Rmarkdown:输出pdf设置

    输出pdf需要安装Ctex --- title: "first markdown" author: "name" date: "`r format(S ...

  8. 【Leetcode】413. Arithmetic Slices

    Description A sequence of number is called arithmetic if it consists of at least three elements and ...

  9. 登録更新(BAPI)

    購買管理(MM) * [BAPI_REQUISITION_CREATE] 購買依頼登録 * [BAPI_REQUISITION_CHANGE] 購買依頼変更 * [BAPI_REQUISITION_D ...

  10. python2.7入门---列表(List)

        序列是Python中最基本的数据结构.序列中的每个元素都分配一个数字 - 它的位置,或索引,第一个索引是0,第二个索引是1,依此类推.Python有6个序列的内置类型,但最常见的是列表和元组. ...