用CSS實現 DataGrid 上下滾動時固定表頭

在使用DataGrid控制項時經常會遇到行數過多會需要上下滾動的情況，但是表頭也會跟著上下滾動，在程式員俱樂部搜尋了一下，發現CSS可以固定表頭，所以分享出來，也許會對各位有協助。

 

CSS如下：

<style type="text/css">
     .fixTitle {POSITION: relative;}   
</style>

 

在DataGrid的頭樣式中指定CSS名就可以了:

<div style="overflow-x: hidden; overflow: auto; width: 100%; height: 472px;">

<asp:DataGrid ID="datagrid1" runat="server" AllowSorting="True">
　　<HeaderStyle HorizontalAlign="Center" CssClass="fixTitle"></HeaderStyle>
　　<Columns>

　　...

　　... 

　　</Columns>      

</asp:DataGrid>  

</div>

 

本文首發：敗家女導購網