css 固定表头

复制代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ClassCoursePlanTestSystem.ClassPlan.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .table-head{padding-right:17px;background-color:#999;color:#000;}
        .table-body{width:100%; height:300px;overflow-y:scroll;}
        .table-head table,.table-body table{width:100%;}
        .table-body table tr:nth-child(2n+1){background-color:#f2f2f2;}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div style="width: 800px;">
            <div class="table-head">
            <table>
                <colgroup>
                    <col style="width: 80px;" />
                    <col />
                </colgroup>
                <thead>
                    <tr><th>序号</th><th style="border:1px solid green;">内容</th></tr>
                </thead>
            </table>
            </div>
            <div class="table-body">
            <table>
                <colgroup><col style="width: 80px;" /><col /></colgroup>
                <tbody>
                    <tr><td>1</td><td>我只是用来测试的我只是用来测试的我只是用来测试的我只是用来测试的我只是用来测试的我只是用来测试的我只是用来测试的我只是用来测试的</td></tr>
                    <tr><td>2</td><td>我只是用来测试的</td></tr>
                    <tr><td>3</td><td>我只是用来测试的</td></tr>
                    <tr><td>4</td><td>我只是用来测试的</td></tr>
                    <tr><td>5</td><td>我只是用来测试的</td></tr>
                    <tr><td>6</td><td>我只是用来测试的</td></tr>
                    <tr><td>7</td><td>我只是用来测试的</td></tr>
                    <tr><td>8</td><td>我只是用来测试的</td></tr>
                    <tr><td>9</td><td>我只是用来测试的</td></tr>
                    <tr><td>10</td><td>我只是用来测试的</td></tr>
                    <tr><td>11</td><td>我只是用来测试的</td></tr>
                    <tr><td>12</td><td>我只是用来测试的</td></tr>
                    <tr><td>13</td><td>我只是用来测试的</td></tr>
                    <tr><td>14</td><td>我只是用来测试的</td></tr>
                    <tr><td>15</td><td>我只是用来测试的</td></tr>
                </tbody>
            </table>
            </div>
        </div>
    </div>
    </form>
</body>
</html>
复制代码

 

posted on   空明流光  阅读(942)  评论(0编辑  收藏  举报

编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!
历史上的今天:
2013-04-12 Tab控件css样式布局

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5
点击右上角即可分享
微信分享提示