HTML示例代码：

    

        

            

                
表头1
                
表头2
                
表头3
                
表头4
                
表头5
                
表头6
                
表头7
            
        
        

            

                
单元格1
                
单元格2
                
单元格3
                
单元格4
                
单元格5
                
单元格6
                
单元格7
            
            
        
    

CSS示例代码：

.table-wrapper {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}

table {
    width: 100%;
}

thead {
    position: sticky;
    top: 0;
}

th {
    background-color: #eee;
    position: sticky;
    top: 0;
    z-index: 1;
}

td, th {
    padding: 8px;
    text-align: center;
    white-space: nowrap;
}

在上面的示例代码中，.table-wrapper 被用作包含表格的容器，它设置了固定的高度和水平滚动条。position: sticky 用于固定表头在视口顶部，并且设置了 top: 0 让其不移动。z-index 属性确保表头显示在表格之上。

使用以上的 HTML 和 CSS 代码即可使得一个带有固定表头和水平滚动条的表格。