<style>
/*设置 tbody高度大于400px时 出现滚动条*/
table tbody {
display: block;
height: 400px;
overflow-y: scroll;
}
table thead, tbody tr {
display: table;
width: 100%;
table-layout: fixed;
}
/*滚动条默认宽度是16px 将thead的宽度减16px*/
table thead {
width: calc( 100% - 1em);
}
</style>

想要table表格垂直滚动,加点CSS即可的更多相关文章

  1. Table表格横竖线实现Css

    .tablel { border-collapse:collapse; /* 关键属性:合并表格内外边框(其实表格边框有2px,外面1px,里面还有1px哦) */ border:solid #999 ...

  2. antd-vue中给table表格整行加点击事件

    <a-table :columns="columns" :dataSource="data" :loading="loading" : ...

  3. bootstrap table表格属性、列属性、事件、方法

    留存一份,原文地址http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 表格参数 表格的参数定义在 jQuery.fn.bootst ...

  4. 利用CSS生成精美细线Table表格

    精美的表格是前端开发用到的一个组件,很多时候我们利用复杂的页面style代码,来生成这样的表格,造成了页面的修改性和可读性都非常差.这里推荐直接使用css来产生一个细线表格. 使用方法也很简单: 第一 ...

  5. CSS小知识---table表格

    所用的仍是bootstrap的模板 <link rel="stylesheet" href="css/bootstrap.min.css"> < ...

  6. java:HTML(table表格,ul列表)和CSS(导入.css文件,三种定义颜色方式,三种样式选择器,a标签属性顺序,)

    1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...

  7. 初探css -11 Table表格

    CSS 表格 使用 CSS 可以使 HTML 表格更美观. Company Contact Country Alfreds Futterkiste Maria Anders Germany Bergl ...

  8. table表格数据无缝循环滚动

    分享一个好看的表格无缝滚动:(实战用起来很舒服) 直接copy代码到你的程序中: 1.HTML <div class="tablebox">              ...

  9. [转]CSS如何设置html table表格边框样式

    原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...

随机推荐

  1. JETSON TK1 ~ 刷机和克隆固件

    1:PC端的ubuntu. 要求必须是正常系统,不可以使用虚拟机.由于烧写过程采用刷机模式,虚拟机刷机易导致刷机问题. 2:驱动包.文件系统和源码下载 1.Driver package(驱动包,相当于 ...

  2. LeetCode:移除K位数字【402】

    LeetCode:移除K位数字[402] 题目描述 给定一个以字符串表示的非负整数 num,移除这个数中的 k 位数字,使得剩下的数字最小. 注意: num 的长度小于 10002 且 ≥ k. nu ...

  3. weak 的内部实现原理

    问题 weak 变量在引用计数为0时,会被自动设置成 nil,这个特性是如何实现的? 答案 在 Friday QA 上,有一期专门介绍 weak 的实现原理.https://mikeash.com/p ...

  4. JDK线程池的实现

    线程池 接口Executor 该接口只有一个方法,JDK解释如下 执行已提交的Runnable 任务的对象.此接口提供一种将任务提交与每个任务将如何运行的机制(包括线程使用的细节.调度等)分离开来的方 ...

  5. 3像素文本偏移bug 解决方案

    <style>.box1{ width:100px; height:50px; float:left; background:#dedede;_margin-right:-3px;}.bo ...

  6. 初步了解Spark生态系统及Spark Streaming

    一.        场景 ◆ Spark[4]: Scope:  a MapReduce-like cluster computing framework designed for low-laten ...

  7. Bootstrap(二)段落+强调内容

    在Bootstrap中为文本设置了一个全局的文本样式(这里所说的文本是指正文文本): 1.全局文本字号为14px(font-size). 2.行高为1.42857143(line-height),大约 ...

  8. Mysql总结_03_mysql常用命令

    一.MySQL服务的启动和停止 net stop mysql net start mysql 二.登陆mysql mysql -u用户名 -p用户密码 键入命令mysql -uroot -p, 回车后 ...

  9. JSTL前台报错

    报错信息: jsp页面报错 Can not find the tag library descriptor for "http://java.sun.com/jsp/jstl/core&qu ...

  10. linux命令学习笔记(18):locate 命令

    locate 让使用者可以很快速的搜寻档案系统内是否有指定的档案.其方法是先建立一个包括系统内所有档案名称及 路径的数据库,之后当寻找时就只需查询这个数据库,而不必实际深入档案系统之中了.在一般的 d ...