锁表头

 <div class="lockContainer" style=" 99%;height:80%;overflow-x:hidden;">
<table  class="formTable" width="100%" >
   <thead>
    <tr>
     <td class="Locked" style="100px;TEXT-ALIGN: center;">
      销售凭证
     </td>
     <td class="Locked" style="150px;TEXT-ALIGN: center;">
      车工号
     </td>
     <td class="Locked" style="100px;TEXT-ALIGN: center;">
      实际结束:执行(日期)
     </td>
     <td class="Locked" style="80px;TEXT-ALIGN: center;">
      订单优先级
     </td>
     
    </tr>
       </thead>
          <tbody>循环内容.............
 </tbody>
            
</div>

lockTable.css  内容如下

.lockContainer{
 overflow: scroll;border: solid 1px #86B9E4;
}
.lockTable{
    border-collapse: collapse;
}
.lockTable td
{
 
 position: relative;
 padding: 0.5px;
    border-top: solid 0px #86B9E4;
 border-bottom: solid 1px #86B9E4;
 border-left: solid 0px #86B9E4;
 border-right: solid 1px #86B9E4;
}

.lockTable td.Locked /* 水平与垂直方向锁住单元格, 不随鼠标或滚动条移动 */
{

 z-index: 30; position: relative;
    background-color: #f3f3f3;
 text-align: center;
    border-top: solid 0px #86B9E4;
 border-bottom: solid 1px #86B9E4;
 border-left: solid 0px #86B9E4;
 border-right: solid 1px #86B9E4;
 top: expression(parentNode.parentNode.parentNode.parentNode.scrollTop);
    left: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft);

}

.lockTable td.HLocked /* 水平方向锁住单元格 */
{

 z-index: 10; position: relative;
 background-color: #f3f3f3;
 text-align: center;
    border-top: solid 0px #86B9E4;
 border-bottom: solid 1px #86B9E4;
 border-left: solid 0px #86B9E4;
 border-right: solid 1px #86B9E4;
 left: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft);

}

.lockTable td.VLocked /* 垂直方向锁住单元格 */
{
 z-index: 20; position: relative;
 background-color: #f3f3f3;
 text-align: center;
    border-top: solid 0px #86B9E4;
 border-bottom: solid 1px #86B9E4;
    border-left: solid 0px #86B9E4;
 border-right: solid 1px #86B9E4;
 top: expression(parentNode.parentNode.parentNode.parentNode.scrollTop);
}

.topbar
{
 z-index: 30; position: relative;
 text-align: center;
 top: expression(parentNode.parentNode.parentNode.parentNode.scrollTop);
    left: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft);
}