html、css固定头部

table表格中实现tbody部分可滚动,且thead部分固定

效果图:

html、css固定头部_第1张图片

关键css:

table thead, table tbody {
            display: block;
        }

        table tbody {
            height: 700px;
            overflow-y: auto;
        }

        table td, table th {
            width: 80px;
        }

具体代码





    
    Table
    


姓名 性别 年级 数学分数 语文分数 英语分数
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
张三 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
李四 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70
王五 一年级 90 80 70

 

 

你可能感兴趣的:(html/css)