table列头固定

清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>

<html>
<head>
   <title>Fixed Header And Columns</title>
   <style type="text/css">
    .Freezing { 
     z-index: 10; 
     position: relative; 
     top: expression(this.offsetParent.scrollTop)
    }
   
    .FreezingCol { 
     z-index: 1; 
     left: expression(document.getElementById("freezingDiv").scrollLeft); 
     position: relative
    }
   
    #DataGrid1 tr{color:#003399;background-color:White;}
   </style>
</head>
<body>
   <div id="freezingDiv" style="overflow:auto; width:400px; height:155px"> 
<table cellspacing="0" cellpadding="4" rules="all" bordercolor="#3366CC" border="1" id="DataGrid1" style="background-color:White;border-color:#3366CC;border-width:1px;border-style:None;width:900px;border-collapse:collapse;">

<!--
	如果页面已经有样式了就用下面这种把class替换掉就行了
<table  class="frame" cellspacing="0" cellpadding="0" rules="all" id="DataGrid1"
style="width:1050px;border-collapse:collapse;" border=0>-->
   <tr class="Freezing" >
    <td class="FreezingCol">ID</td>  
    <td class="FreezingCol">得意先</td>
    <td>担当</td>  
    <td>電話</td>  
    <td>ファックス</td>  
    <td>県</td>  
    <td>住所</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';"> 
    <td class="FreezingCol"><span>1</span> </td>    
    <td class="FreezingCol"> <span>喫茶たいむましん</span>     </td>   
   <td>林  千春</td>    
   <td>(0952)26-64XX</td>    
   <td></td>    
   <td>佐賀県</td>    
   <td>佐賀市長瀬町 23-XX</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';">  
   <td class="FreezingCol"> <span>2</span> </td>    
   <td class="FreezingCol"> <span>小料理なんごく</span> </td>   
    <td>河本 なみ</td>
     <td>(0988)55-87XX</td>    
     <td>(0988)55-87XX</td>    
     <td>沖縄県</td>    
     <td>那覇市繁多川 1-21-XX</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';">
      <td class="FreezingCol">        <span>3</span>     </td>    
      <td class="FreezingCol">        <span>割烹ふじい</span>     </td>    
      <td>山久 良美</td>    
      <td>(0764)25-58XX</td>    
      <td>(0764)25-58XX</td>    
      <td>富山県</td>    
      <td>富山市朝菜町 2-702-XX</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';"> 
      <td class="FreezingCol">        <span>4</span>     </td>    
      <td class="FreezingCol">        <span>海鮮料理くじら</span>     </td>    
      <td>和辺 義隆</td>   
      <td>(0592)32-65XX</td>    
      <td>(0592)32-65XX</td>    
      <td>三重県</td>    
      <td>津市一身田中野 19-X</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';"> 
      <td class="FreezingCol">        <span>5</span>     </td>    
      <td class="FreezingCol">        <span>居酒屋ななべえ</span>     </td>    
      <td>渡川 秀人</td>    
      <td>(075)392-76XX</td>    
      <td>(075)392-76XX</td>    
      <td>京都府</td>    
      <td>京都市西京区山田平尾町 73-X</td> 
   </tr>  
   <tr onmouseover="this.style.backgroundColor='#8EAAE9';"
            onMouseOut="this.style.backgroundColor='';"> 
      <td class="FreezingCol">        <span>6</span>     </td>    
      <td class="FreezingCol">        <span>酒蔵でん</span>     </td>    
      <td>小田 勝也</td>    
      <td>(0886)92-34XX</td>    
      <td></td>    
      <td>徳島県</td>    
      <td>板野郡藍住町住吉 5-XXX</td> 
   </tr>  
   <tr>  
      <td class="FreezingCol">        <span>7</span>     </td>    
      <td class="FreezingCol">        <span>寿ストアー</span>     </td>    
      <td>池林 裕香</td>    
      <td>(03)3763-01XX</td>    
      <td>(03)3763-01XX</td>    
      <td>東京都</td>    
      <td>大田区大森東 1-35-X</td> 
   </tr>  
   <tr>  
      <td class="FreezingCol">        <span>8</span>     </td>    
      <td class="FreezingCol">        <span>温泉レストラン</span>     </td>    
      <td>池山 剛司</td>    
      <td>(0279)88-31XX</td>    
      <td>(0279)88-31XX</td>    
      <td>群馬県</td>    
      <td>吾妻郡草津町 462-XX</td> 
   </tr> 
   <tr>  
      <td class="FreezingCol">        <span>9</span>     </td>    
      <td class="FreezingCol">        <span>大和マーケット</span>     </td>    
      <td>木山 勇</td>    
      <td>(0262)21-48XX</td>    
      <td></td>    
      <td>長野県</td>    
      <td>長野市大豆島 1798-X</td> 
   </tr>  
   <tr>  
      <td class="FreezingCol">        <span>10</span>     </td>    
      <td class="FreezingCol">        <span>東海道スーパー</span>     </td>    
      <td>鈴藤 哲也</td>    
      <td>(0474)78-57XX</td>    
      <td>(0474)78-57XX</td>    
      <td>千葉県</td>    
      <td>習志野市津田沼 2-6-XX</td> 
   </tr>     
</table>
</div>
</body>
</html>