table表头固定问题
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表头固定问题的更多相关文章
- HTML table表头固定
HTML table表头固定 说说我在最近项目中碰到的css问题吧,作为问题知识集合总结笔记: <!DOCTYPE html> <html> <head> < ...
- 纯CSS实现table表头固定(自创备忘)
因为之前约定时候产品没说要表头固定,这次迭代测试突然提出这个需求,而且不知道因为什么未知原因非要这样不可--因为之前用了table标签做表单,而且也没用插件,这下就难了点,找另外一个前端前辈妹子商量了 ...
- table 表头固定 thead固定. 1) 使用jquery.freezeheader.js
方法一: 使用jquery.freezeheader.js 固定表头: 1-: 初始化: <!DOCTYPE html> <html lang="en"> ...
- jQuery,Table表头固定插件chromatable存在的问题及解决办法
在最近的项目中需要将表格的表头固定,搜寻了大量的资料,发现chromatable插件还是比较方便的.但是当我在一个页面中多次使用 chromatable固定对个表格的表头时问题就出现了,首先说明系统的 ...
- table表头固定
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- table 表头固定
<html> <head> <title>Test</title> <style type="text/css"> .d ...
- Html - Table 表头固定和 tbody 设置 height 在IE不起作用的解决
原文地址,转载请注明出处:http://www.cnblogs.com/jying/p/6294063.html 做项目的时候发现给 tbody设置 height 和 overflow-y 在IE下不 ...
- html5 table的表头固定的HTML代码
table的表头固定的HTML代码 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...
- bootstrap table 实现固定悬浮table 表头并可以水平滚动
在开发项目中,需要将表格头部固定,而且表格大多数情况下是会水平滚动的.项目的css框架是bootstrap 3,故也可以叫做bootstrap table. 需要实现的是:表格头部固定,并且支持水平滚 ...
随机推荐
- 在Pycharm中导入第三方模块库(诸如:matplotlib、numpy等)
在Pycharm中导入第三方模块库 一.打开pycharm: 二.点击菜单上的“file” -> “setting”: 三.步骤二完成后出现界面如下所示.选中你的项目(比如thisyan Pro ...
- Hadoop参数调优
转自:http://blog.sina.com.cn/s/blog_6a67b5c50100vop9.html dfs.block.size 决定HDFS文件block数量的多少(文件个数),它会间接 ...
- jenkins+maven+docker集成java发布(一)自动发布
JAVA项目持续集成发布 标签(空格分隔): java jenkins 微服务中持续集成自动发布是很重要的一个环节,将不同的模块应用自动部署到一台或者N台服务器中如果采用人工部署的方式不太现实 git ...
- (转)Updates were rejected because the tip of your current branch is behind
刚创建的github版本库,在push代码时出错: $ git push -u origin masterTo git@github.com:******/Demo.git ! [rejected] ...
- 单片机C51 8位流水灯
#include<reg51.h> sbit P1_0=0X90; sbit P1_1=0x91; sbit P1_2=0x92; sbit P1_3=0x93; sbit P1_4=0x ...
- HDU暑假多校第八场G-Card Game
一.题意 给出N个卡牌,卡牌的正反两面具有两个数字,取值范围为[1,2*n],给出若干个默认正面向上的卡牌,求最小反转多少张卡牌可以使得,每张卡牌朝上的面上都有一个不同的数字,同时满足最小反转次数的反 ...
- elasticsearch 关联查询
父-子关系文档 父-子关系文档 在实质上类似于 nested model :允许将一个对象实体和另外一个对象实体关联起来. 而这两种类型的主要区别是:在 nested objects 文档中,所有对象 ...
- 环境变量 - JDK
Linux 1. 备份并编辑配置文件 # cp /etc/profile /etc/profile.bak # vi /etc/profile 2. 设置JDK环境变量 export JAVA_HOM ...
- autofac无法解析一例
在asp.net mvc分项目开发中,如果类库位于其他的项目中,则必须在global中对其他项目的类库进行注册,否则会报“ None of the constructors found with 'A ...
- Android Open Source Projects(汇总与整理)
Android Open Source Projects 目前包括: Android开源项目第一篇——个性化控件(View)篇 包括ListView.ActionBar.Menu.ViewPager ...