如下图同Excel表格首行固定:

<style>
.table{    width: 100%;    border-collapse:collapse;    border-spacing:0;}

.table thead{display: block; width: 100%; background: #ddd;} 
.table tbody{display: block; height:70px; overflow: auto; width: 100%; border: 1px solid #ddd;}
.table td,.table th { width: 200px; border-bottom: none; border-left: none; border-right: 1px solid #CCC; border-top: 1px solid #DDD; padding: 2px 3px 3px 4px }
.table tr{ border-bottom: 1px solid #B74; } </style>
<table class="table">
<thead>
<tr>
<th>header</th>
<th>header two</th>
<th>header two</th>
<th>header two</th>
<th>header two</th>
<th>header two</th>
</tr>
</thead>
<tbody class="M_scrollBar">
<tr>
<td>fuck 1</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
</tr>
<tr>
<td>fuck 1</td>
<td>fuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>kfuc<br>k 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
</tr>
<tr>
<td>fuck 1</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
</tr>
<tr>
<td>fuck 1</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
<td>fuck 2</td>
</tr>
</tbody>
</table>

html 表格head头部不动 body部分滚动,每格宽同内容增加的更多相关文章

  1. 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  2. excel表格中打开可以显示整个表格但是打印却只能打印一个单元格

    excel表格中打开可以显示整个表格但是打印却只能打印一个单元格 如下图显示 解决办法 2007 版菜单栏上 ----->页面布局----->打印区域----->取消打印.即可正常. ...

  3. Swift - 可编辑表格样例(可直接编辑单元格中内容、移动删除单元格)

    (本文代码已升级至Swift3)   本文演示如何制作一个可以编辑单元格内容的表格(UITableView). 1,效果图 (1)默认状态下,表格不可编辑,当点击单元格的时候会弹出提示框显示选中的内容 ...

  4. js如何实现动态显示表格数据(点奇数显示奇数单元格内容)

    js如何实现动态显示表格数据(点奇数显示奇数单元格内容) 一.总结 一句话总结: 1.动态指定表格中每个单元格的id,然后通过id可以获取每个单元格,然后对里面的innerHTML进行赋值. 2.弄了 ...

  5. JS遍历表格获取每行数据及每个单元格数据

    /** * 遍历表格获取每行数据及每个单元格数据 * @param tableID 表格ID */ function GetTable(tableID) { var milasUrl = {};//新 ...

  6. 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动

    一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...

  7. css固定div头部不随滚动条滚动

    给div加浮动: position:fixed; 固定宽度,高度,距离头部,左部为0:width: 99%; height: 80px; top:0; left: 0;

  8. pc页面滚动的时候,背景图不动只是页面滚动

    代码如下,直接拷贝出去就能看效果: 用到的方法 background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动. <!DOCTYPE html> <h ...

  9. 容器,表格 ,div,元素可左右拖动,滚动 css

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

随机推荐

  1. APP的缓存文件到底应该存在哪?看完这篇文章你应该就自己清楚了

    APP的缓存文件到底应该存在哪?看完这篇文章你应该就自己清楚了 彻底理解android中的内部存储与外部存储 存储在内部还是外部 所有的Android设备均有两个文件存储区域:"intern ...

  2. KVO内部实现原理

    KVO的原理: 只要给一个对象注册一个监听, 那么在运行时, 系统就会自动给该对象生成一个子类对象, (格式如:NSKVONotifying_className), 并且重写自动生成的子类对象的被监听 ...

  3. 数据结构之二分查找(PHP)

    <?php //二分查找算法 //前提:索引数组.数组已排好顺序 $a=array(1,3,4,6,8,9,11,13,15,24,25,27,30,38); $search = 30;//要查 ...

  4. (String)、toString、String.valueOf的区别

    String.valueOf()它可以将JAVA基本类型(int,double,boolean等)和对象(Object)转换成String型toString()是对象的方法,它可以将该对象转换成Str ...

  5. Leetcode 367. Valid Perfect Square

    Given a positive integer num, write a function which returns True if num is a perfect square else Fa ...

  6. 【poj1419】 Graph Coloring

    http://poj.org/problem?id=1419 (题目链接) 题意 求一般图最大独立集. Solution 最大独立集=补图的最大团. 代码 // poj1419 #include< ...

  7. CruiseControl.NET与TFS结合的配置文件

    配置如下: <cruisecontrol xmlns:cb="urn:ccnet.config.builder"> <project name="测试项 ...

  8. lbs(查看附近的人),看看社交软件如何实现查看附近的人

    最近在做一款移动端棋牌游戏,为了进一步提高用户体验.拉近玩家的距离,我们决定在游戏中加入好友功能,而对于体验好友功能的玩家来说,要是玩牌的时候可以看看附近都有谁在玩牌,跟他们交流交流玩牌心得什么的无疑 ...

  9. EF 知识点

    EntityFrameWorak知识点记录 发展史 EF1.0时,只支持Database First,数据库优先.必须将设计器指向一个现有的数据库. EF4时,支持Model First,模型优先.可 ...

  10. 用DOS命令打开IE浏览器、我的文档等等

    用DOS命令打开IE浏览器 在“start”-运行中直接输入网址就可以了.如输入百度: http://www.baidu.com Command:[ start  http://www.baidu.c ...