如何固定table的表头

来源:互联网 发布:淘宝店哪些东西利润高 编辑:程序博客网 时间:2024/04/30 11:35
1.html代码
<HTML>
    
<HEAD>
        
<title></title>
        
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        
<style> .fixedHeaderTr { position:relative; top:expression(this.offsetParent.scrollTop); }
    ; .mainDiv 
{ overflow:auto; scrollbar-face-color:9999ff; height:expression((document.body.clientHeight-this.offsetTop-20>this.children[0].offsetHeight)?(this.children[0].offsetHeight+20) : (document.body.clientHeight-this.offsetTop-20)); width:expression(document.body.clientWidth-20); }
        
</style>
    
</HEAD>
    
<body>
        
<br>
        
<div class="mainDiv">
            
<%=fixedHeader()%>
        
</div>
    
</body>
</HTML>
2.cs代码
public class FixTableHeader : System.Web.UI.Page
    
{
        
private void Page_Load(object sender, System.EventArgs e)
        
{
            
// 用于固定table的表头
        }


        
Web Form Designer generated code

        
protected string fixedHeader()
        
{
            
string str=@"<table width="+"/""+"100%"+"/"" +"border="+"/""+"1"+"/""+" cellspacing="+"/""+"0"+"/""+" style="+"/""+"MARGIN-TOP:-2px"+"/""+">";
                str
+="<TR class="+"/""+"fixedHeaderTr"+"/""+" style="+"/""+"BACKGROUND:navy;COLOR:white"+"/""+">";
                    str
+="<TD nowrap>Header A</TD>";
                    str
+="<TD nowrap>Header B</TD>";
                    str
+="<TD nowrap>Header C</TD>";
                str
+="</TR>";
            
for(int m=0;m<100;m++)
            
{
                str
+="<TR>";
                    str
+="<TD>A"+m+"</TD>";
                    str
+="<TD>B"+m+"</TD>";
                    str
+="<TD>C"+m+"</TD>";
                str
+="</TR>";
            }
            
            str
+="</table>";
            
return str;
        }

    }