用CSS样式来实现DataGrid、GridView控件表头固定、指定列固定

固定表头：

第一步：在程序中添加css代码，既可以保存为单独的文件，也可以在页面中引用。

Css代码如下：

.Fixed

{

position:relative;

table-layout:fixed;

z-index:10;

top:expression(this.offsetParent.scrollTop);

}

.Fixed th

{

text-overflow:ellipsis;

overflow:hidden;

white-space:nowrap;

padding:2px;

}

第二步：在##.aspx.cs文件后台Page_Load中引用Css代码（也可以在##.aspx文件的head标签中引用，这里不做介绍）

代码如下：

//-----（（（（（子页面中引用css

HtmlLink CssControl = new HtmlLink();

CssControl.Href = "~/Css/Style.css"; //指定路径

CssControl.Attributes.Add("rel", "stylesheet");

Page.Header.Controls.Add(CssControl);

CssControl.Attributes.Add("type", "text/css");

//-----）））））

第三步：在##.aspx文件的DATAGRID(GRIDVIEW)控件中引用

代码如下：

<asp:DataGrid ID="DataGrid1" runat="server">

…

</Columns>

…

</asp:DataGrid>

</div>

注：overflow-y:scroll为竖向滚动条显示，因为要固定表头，一般情况下要指定固定高度。

在DATAGRID(GRIDVIEW)表头样式中引用Css(CssClass="Fixed")。

第四步：在页面的<head>标签中引用如下代码。（如果使用母板页则可以在母板页添加）

代码如下：

注：这行代码的含义是在IE8中以IE7的显示模式来进行渲染。

固定指定列：

第一步：在程序中添加css代码，既可以保存为单独的文件，也可以在页面中引用。

Css代码如下：

.FixCol

{

position: relative;

table-layout:fixed;

z-index:10;

left: expression(this.offsetParent.scrollLeft);

}

第二步：在##.aspx.cs文件后台Page_Load中引用Css代码（也可以在##.aspx文件的head标签中引用，这里不做介绍）

代码如下：

//-----（（（（（子页面中引用css

HtmlLink CssControl = new HtmlLink();

CssControl.Href = "~/Css/Style.css"; //指定路径

CssControl.Attributes.Add("rel", "stylesheet");

Page.Header.Controls.Add(CssControl);

CssControl.Attributes.Add("type", "text/css");

//-----）））））

第三步：在##.aspx文件的DATAGRID(GRIDVIEW)控件中引用

代码如下：

<asp:DataGrid ID="DataGrid1" runat="server">

<asp:BoundColumn DataField="" HeaderText="" ReadOnly="True">

</asp:BoundColumn>

…

</Columns>

…

</asp:DataGrid>

</div>

注：overflow-x:scroll为横向滚动条显示，因为要固定指定的列，一般情况下要指定固定宽度。

在DATAGRID(GRIDVIEW)列的样式中引用Css(CssClass="FixCol ")。

第四步：在页面的<head>标签中引用如下代码。（如果使用母板页则可以在母板页添加）

代码如下：

注：这行代码的含义是在IE8中以IE7的显示模式来进行渲染。

注：这里只是指定了一种方法，具体实现过程中，需要根据实际情况进行细微调整。