• 功能描述：

　　　　在一个Table中实现表头固定不动，内容部分实现通过滚动条滚动。

  • 实现效果：

　　　　

　　　　当页面宽度变宽时，只有最后一列的宽度会改变。

　　　　

　　　　

  • 逻辑实现：

　　　　1、将表头和内容分别使用两个table标签包裹，每一个table使用div包裹，并设置不同的样式。

　　　　2、除了最后一列外，每一列的tr和td中都包含一个div，在div内输入显示的信息，并设置样式。

  • 具体实现：

　　　　

　　　　

　　　　

在Table的Tbody中实现滚动条滚动的更多相关文章

  1. table下tbody滚动条与thead对齐的方法且每一列可以不均等

    1 前言 table下tbody滚动条与thead对齐的方法,开始在tbody的td和thead的tr>td,对每一个Item加入百分比,结果是没对齐.也尝试了用bootstrap的col-md ...

  2. CSS 设置table下tbody滚动条

    table tbody { display:block; height:195px; overflow-y:scroll; } table thead, tbody tr { display:tabl ...

  3. table给tbody设置滚动条

    table结构例子: <table class="layui-table"> <thead> <tr> <th> 贷款项目 < ...

  4. CSS设置table下tbody滚动条与thead对齐的方法

    <style>table tbody {display:block;height:195px;overflow-y:scroll;} table thead, tbody tr {disp ...

  5. js网页滚动条滚动事件实例分析

    本文实例讲述了js网页滚动条滚动事件用法.分享给大家供大家参考.具体分析如下: 在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:window.onscroll.当onscroll事件 ...

  6. 当滚动条滚动到页面底部自动加载增加内容的js代码

    这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...

  7. Javascript禁止父元素滚动条滚动， pc、移动端均有效

    在网页中经常会遇到这样的场景, 网页比较长有滚动条, 然后网页内的某个内容块里面的内容也比较长, 也具有滚动条.当鼠标移到内容块中使用滚动条来滚动查看内容到达底部或头部的时候,父元素的滚动条也就开始滚 ...

  8. WM_SYSCOMMAND包括很多功能，比如：拖动左边框、拖动标题栏、滚动条滚动、点击最小化、双击标题栏——Delphi 通过事件代替了大部分常用的消息，所以Delphi 简单、易用、高效

    procedure TForm1.WMSysCommand(var Message: TWMSysCommand); var str: string; begin case Message.CmdTy ...

  9. 一款回到顶部的 jQuery 插件，支持 Div 中的滚动条回到顶部

    前言 今天在网上搜索“回到顶部”的 jQuery 插件,网上有很多,但是大部分都不支持让 Div 中的滚动条回到顶部.于是乎,不放弃,自己参考 Github 上的一个 jQuery 插件,经过自己的修 ...

随机推荐

  1. cocos2d(x) HTML label ;CCHTML CCHTMLLabel

    这几天由于特殊需要,写了一个HTMLLabel.可以直接支持HTML的几种格式,<font> <a href> color size 等等. 参考object C的一个ios开 ...

  2. Exchange Server 2013 一步步安装图解[完全步骤截图]

    前言: 这是一份为Exchange菜鸟准备的2013版本安装文档,安装环境为Windows Server 2012 DataCenter 版本,在安装之前,我对安装Exchange也是处于一无所知的状 ...

  3. java 逆波兰表达式

    最近想把这破机 装成WIN7 想想还是算了 ...  反正用的机会也不多. 不过 发现了一些 想念的东西 从前的作业. 从前的记忆. package org.lmz; import java.util ...

  4. Unity3D中使用MiniJson解析json的例子

    json: --------------------------------- {     "name":"中国",     "province&qu ...

  5. 文件上传<springmvc>

    使用commons-fileupload-1.3.1.jar和commons-io-2.4.jar web.xml <?xml version="1.0" encoding= ...

  6. .Net 生成条形码

    1,下面一个类,可以直接复制下去使用: public class Code39    {        private Hashtable m_Code39 = new Hashtable();    ...

  7. Girl Develop It Chapter Leaders at 2015 Annual Leadership Summit

    Girl Develop It Chapter Leaders at 2015 Annual Leadership Summit Corinne Warnshuis, Executive Direct ...

  8. Linux 下Nginx 的安装及负载均衡的简单配置

    这次发布程序需要均衡负载,网上看了一下这方便的东西,觉得很不错,学完之后做下总结,一遍后期用到. 1.安装nginx之前需要安装的两个依赖,pcre-x.x.x.tar.gz 和pcre-devel- ...

  9. JDK安装（CentOS/rpm方式）

    1. 用如下命令检验是否已经自带了OpenJDK java -version 如果打印如下,则表示安装了OpenJDK java version "1.6.0" OpenJDK R ...

  10. python3 列表 函数

    python3中list的所有函数 list是有序的,元素个数无限的,元素类型多样的,可变的 增加 # 'append', 增加对象# 'insert', 指定位置增加# 'extend', 增加可迭 ...