在Web上凍結DataGrid的列頭 [轉]

 ASP.NET頁面中,有時候我們需要凍結datagrid中的某一列,比如顯示的數據項過多時,我們需要讓第一列不動,拖動橫向滾動條時其他列隱藏,這時就需要凍結列了;另外,有時候也需要讓datagrid的頭部不動,拖動縱向滾動條時,下面的數據項可以滾動。在實現的過程中,其實就是用了css樣式來控制,一起看一下。  

  要凍結哪一列,就把fixCol這個CSS加到HeaderStyle-CssClass和ItemStyle-CssClass-->  

<style type="text/css">  
 .fixCol {}{ ; LEFT: expression(this.offsetParent.scrollLeft); POSITION: relative }  
</style>  
</HEAD>  

<asp:BoundColumn DataField="LastName" HeaderText="姓名">  
 <!--下面就是凍結列-->  
 <HeaderStyle CssClass="fixCol"></HeaderStyle>  
 <ItemStyle CssClass="fixCol"></ItemStyle>  
</asp:BoundColumn>  

把fixTitle這個CSS加到DataGrid的HeaderStyle-CssClass和ItemStyle-CssClass-->  

<style type="text/css">  
 .fixTitle {}{ POSITION: relative; ; TOP: expression(this.offsetParent.scrollTop) }  
</style>  
</HEAD>  

<!--凍結頭部-->  
<ItemStyle ForeColor="#330099" BackColor="White" CssClass="fixTitle"></ItemStyle>  
<HeaderStyle Font-Bold="True" ForeColor="#FFFFCC" BackColor="#990000" CssClass="fixTitle"></HeaderStyle>  

<FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
發佈了24 篇原創文章 · 獲贊 0 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章