本方法只需要设置一个gridview的宽度,其它宽度不需要设置。测试环境:ie6,firefox通过。

c#
<%@ page language="c#" autoeventwireup="true" %>
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"
"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<script runat="server">
// 计算数据,完全可以从数据看取得
icollection createdatasource( )
{
system.data.datatable dt = new system.data.datatable();
system.data.datarow dr;
dt.columns.add(new system.data.datacolumn("学生班级", typeof(system.string)));
dt.columns.add(new system.data.datacolumn("学生姓名", typeof(system.string)));
dt.columns.add(new system.data.datacolumn("语文", typeof(system.decimal)));
dt.columns.add(new system.data.datacolumn("数学", typeof(system.decimal)));
dt.columns.add(new system.data.datacolumn("英语", typeof(system.decimal)));
dt.columns.add(new system.data.datacolumn("计算机", typeof(system.decimal)));
for (int i = 0; i < 50; i++)
{
system.random rd = new system.random(environment.tickcount * i); ;
dr = dt.newrow();
dr[0] = "班级" + i.tostring();
dr[1] = "【孟子e章】" + i.tostring();
dr[2] = system.math.round(rd.nextdouble() * 100, 2);
dr[3] = system.math.round(rd.nextdouble() * 100, 2);
dr[4] = system.math.round(rd.nextdouble() * 100, 2);
dr[5] = system.math.round(rd.nextdouble() * 100, 2);
dt.rows.add(dr);
}
system.data.dataview dv = new system.data.dataview(dt);
return dv;
}
protected void page_load( object sender, eventargs e )
{
if (!ispostback)
{
gridview1.attributes.add("style", "table-layout:fixed");
gridview1.datasource = createdatasource();
gridview1.databind();
}
}
</script>
<script type="text/javascript">
function s()
{
var t = document.getelementbyid("<%=gridview1.clientid%>");
var t2 = t.clonenode(true)
for(i = t2.rows.length -1;i > 0;i--)
t2.deleterow(i)
t.deleterow(0)
a.appendchild(t2)
}
window.onload = s
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>创建表头固定,表体可滚动的gridview</title>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<div id="a">
</div>
<div style="overflow-y: scroll; height: 200px">
<asp:gridview id="gridview1" runat="server" font-size="12px" backcolor="#ffffff"
gridlines="both" cellpadding="4" width="560">
<headerstyle backcolor="#ededed" height="26px" />
</asp:gridview>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
vb.net
<%@ page language="vb" %>
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<script runat="server">
function createdatasource() as icollection
dim dt as system.data.datatable = new system.data.datatable
dim dr as system.data.datarow
dt.columns.add(new system.data.datacolumn("学生班级", gettype(system.string)))
dt.columns.add(new system.data.datacolumn("学生姓名", gettype(system.string)))
dt.columns.add(new system.data.datacolumn("语文", gettype(system.decimal)))
dt.columns.add(new system.data.datacolumn("数学", gettype(system.decimal)))
dt.columns.add(new system.data.datacolumn("英语", gettype(system.decimal)))
dt.columns.add(new system.data.datacolumn("计算机", gettype(system.decimal)))
dim i as integer = 0
while i < 50
dim rd as system.random = new system.random(environment.tickcount * i)
dr = dt.newrow
dr(0) = "班级" + i.tostring
dr(1) = "【孟子e章】" + i.tostring
dr(2) = system.math.round(rd.nextdouble * 100, 2)
dr(3) = system.math.round(rd.nextdouble * 100, 2)
dr(4) = system.math.round(rd.nextdouble * 100, 2)
dr(5) = system.math.round(rd.nextdouble * 100, 2)
dt.rows.add(dr)
system.math.min(system.threading.interlocked.increment(i), i - 1)
end while
dim dv as system.data.dataview = new system.data.dataview(dt)
return dv
end function
protected sub page_load(byval sender as object, byval e as eventargs)
if not ispostback then
gridview1.attributes.add("style", "table-layout:fixed")
gridview1.datasource = createdatasource()
gridview1.databind()
end if
end sub
</script>
<script type="text/javascript">
function s()
{
var t = document.getelementbyid("<%=gridview1.clientid%>");
var t2 = t.clonenode(true)
for(i = t2.rows.length -1;i > 0;i--)
t2.deleterow(i)
t.deleterow(0)
a.appendchild(t2)
}
window.onload = s
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>创建表头固定,表体可滚动的gridview</title>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<div id="a">
</div>
<div style="overflow-y: scroll; height: 200px">
<asp:gridview id="gridview1" runat="server" font-size="12px" backcolor="#ffffff"
gridlines="both" cellpadding="4" width="560">
<headerstyle backcolor="#ededed" height="26px" />
</asp:gridview>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>