【第22期】观点:IT 行业加班,到底有没有价值?

tbody 加滚动条

原创 2016年08月30日 21:20:31

在页面中给tbody加滚动条保持thead不动。

<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<table class="table">
<thead>
<tr>
<th>head1</th>
<th>head2</th>
<th>head3</th>
<th>head4</th>
<th>head5</th>
<th>head6</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>4</td>
<td>4</td>
<td>4</td>
<td>4</td>
<td>4</td>
</tr>
<tr>
</tbody>
.table thead tr {
display:block;
}
.table tbody {
display: block;
height: 100px;
overflow: auto;
}
.table th {
width:20%;
}
.table td {
width:20%;
} 

将thead和tbody都设置成块级元素之后,单元格的宽度有可能不一样,因此一定要设置单元格的宽度保持一致。

版权声明:本文为博主原创文章,未经博主允许不得转载。 举报

相关文章推荐

用css 给tbody加垂直滚动条

思路就是 1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto。 2,把thead的tr设置成display:block。 3,因为都设...

如何设置table的tbody高度,超出默认高度会出现滚动条!!!

需求:标题栏固定,tbody里的内容滑动;   解决方案:用的是两个div内套了两个table,一个放thead,一个放thead,看起来像是一个table。padding-right:17px是指...

程序员升职加薪指南!还缺一个“证”!

CSDN出品,立即查看!

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

威易网CSS教程 table tbody {     display:block;     height:195px;     overflow-y:scroll; } table...

html 控制表格Tbody内容滚动

html里面表格是不容易控制的元素,我在项目中遇到过想让tbody内容超出后滚动,我尝试了很多办法,比如把thead设置position:absolute;再设置top啊,margin啊。。。都感觉不...

TBODY显示滚动条 (让THEAD不滚动,TBODY滚动)

body {                 border: 0;                 margin: 0;                 overflow: hidden;      ...
  • inaoen
  • inaoen
  • 2011-12-15 15:42
  • 17424

滚动条下拉时 table 的thead 固定在网页固定在顶部不动

一、效果图 二、前端页面 场地预定 .table-chang{margin-left: 0px

如何用纯CSS固定thead实现表格滚动?tbody设置overflow之密

首先,大家是不是在做下面代码这样的尝试? THEAD-TD1THEAD-TD2 style="height:100px;overflow:auto;...
  • binjly
  • binjly
  • 2013-07-29 16:20
  • 6327

用css 给tbody加垂直滚动条

思路就是 1,把tbody设置成display:block,然后就对其高度设置一个固定值,overflow设置成auto。 2,把thead的tr设置成display:block。 3,因为都设...
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)