css固定表头

于 2014-12-17 15:32:00 发布
阅读量113 收藏
点赞数
文章标签： python 测试
原文链接：https://my.oschina.net/u/1861097/blog/357160
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

        .main{

            font-family: '微软雅黑';

            width: 100%;

            border-left:1px solid #dfdfdf ;

            border-top:1px solid #dfdfdf ;

            border-right: 1px solid #dfdfdf;

        }

        .head table{

            width: 100%;

            height: 30px;

            padding-right: 17px;

            border-bottom: 1px solid #dfdfdf;

        }

        .head th{

            border-right: 1px solid #dfdfdf;

        }

        .body table{

            width: 100%;

        }

        .body tr{

            border-top: 1px solid #dfdfdf;

            border-bottom: 1px solid #dfdfdf;

            height: 30px;

        }

        .body td{

            border-right: 1px solid #dfdfdf;

            border-bottom: 1px solid #dfdfdf;

        }

        .body{

            max-height: 500px;

            overflow-y: scroll;

        }

    </style>

</head>

<body>

<div class="main">

<div class="head">

    <table cellpadding="0" cellspacing="0">

        <tr>

            <th width="120">测试项目1</th>

            <th width="20">测试项目2</th>

            <th width="20">测试项目3</th>

            <th width="20">测试项目4</th>

            <th width="20">测试项目5</th>

        </tr>

    </table>

</div>

<div class="body">

    <table cellpadding="0" cellspacing="0">

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>            <tr>

        <td width="120">单元测试1</td>

        <td width="20">单元测试2</td>

        <td width="20">单元测试3</td>

        <td width="20">单元测试4</td>

        <td width="20">单元测试5</td>

    </tr>

        <tr>

            <td width="120">单元测试1</td>

            <td width="20">单元测试2</td>

            <td width="20">单元测试3</td>

            <td width="20">单元测试4</td>

            <td width="20">单元测试5</td>

        </tr>

    </table>

</div>

</div>

</body>

</html>


转载于:https://my.oschina.net/u/1861097/blog/357160

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值