效果：
CSS样式(Office2003.css)：
1 /*GridViewCSS office2003blue*/ 2 .GridViewStyle 3 { 4 font-family: Arial, Sans-Serif; 5 font-size:small; 6 table-layout: auto; 7 border-collapse: collapse; 8 border:#4F93E3 1px solid; 9 } 10 /*Header and Pager styles*/ 11 .HeaderStyle/*, .PagerStyle*/ /*Common Styles*/ 12 { 13 background-image: url(Images/hdbg.gif); 14 background-repeat:repeat-x repeat-y; 15 background-color:#d1dbe0; 16 } 17 .HeaderStyle th 18 { 19 padding: 5px; 20 color:#000000; 21 } 22 .HeaderStyle a 23 { 24 text-decoration:none; 25 color:#000000; 26 display:block; 27 text-align:left; 28 font-weight:normal; 29 } 30 .PagerStyle table 31 { 32 text-align:center; 33 margin:auto; 34 } 35 .PagerStyle table td 36 { 37 border:0px; 38 padding:5px; 39 } 40 .PagerStyle td 41 { 42 border-top: solid 1px #BFD3EE; 43 } 44 .PagerStyle a 45 { 46 color:#16387c; 47 text-decoration:none; 48 padding:2px 10px 2px 10px; 49 /*border-top:solid 1px #fff;*/ 50 border-top:solid 1px #91a7b4; 51 border-right:solid 1px #91a7b4; 52 border-bottom:solid 1px #91a7b4; 53 /*border-left:solid 1px #fff;*/ 54 border-left:solid 1px #91a7b4; 55 } 56 .PagerStyle span 57 { 58 font-weight:bold; 59 color:#16387c; 60 text-decoration:none; 61 padding:2px 10px 2px 10px; 62 } 63 /*RowStyles*/ 64 .RowStyle td, .AltRowStyle td, .SelectedRowStyle td, .EditRowStyle td /*Common Styles*/ 65 { 66 padding: 5px; 67 border: solid 1px #BFD3EE; 68 } 69 .RowStyle td 70 { 71 background-color: #FFFFFF; 72 border:solid 1px #BFD3EE; 73 } 74 .AltRowStyle td 75 { 76 background-color: #EDF5FF; 77 } 78 .SelectedRowStyle td 79 { 80 background-color: #fcb814; 81 }
前台：
1 <!DOCTYPE html> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head runat="server"> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <title></title> 7 <link href="App_Themes/office2003.css" rel="stylesheet" /> 8 </head> 9 <body> 10 <form id="form1" runat="server"> 11 <div> 12 <asp:GridView ID="GridView1" runat="server" AllowPaging="True" CssClass="GridViewStyle" EnableModelValidation="True" PageSize="15" OnPageIndexChanged="GridView1_PageIndexChanged"> 13 <AlternatingRowStyle CssClass="AltRowStyle" /> 14 <HeaderStyle CssClass="HeaderStyle" /> 15 <RowStyle CssClass="RowStyle" /> 16 <PagerStyle CssClass="PagerStyle" /> 17 <SelectedRowStyle CssClass="SelectedRowStyle" /> 18 </asp:GridView> 19 </div> 20 </form> 21 </body> 22 </html>
后台：
1 protected void Page_Load(object sender, EventArgs e) 2 { 3 if (!Page.IsPostBack) 4 { 5 DataTable dt = new DataTable(); 6 dt.Columns.Add(new DataColumn("AccountNumber11111111111111111111")); 7 dt.Columns.Add(new DataColumn("AccountName")); 8 dt.Columns.Add(new DataColumn("City")); 9 dt.Columns.Add(new DataColumn("Country")); 10 dt.Columns.Add(new DataColumn("AccountNumber1")); 11 dt.Columns.Add(new DataColumn("AccountName1")); 12 dt.Columns.Add(new DataColumn("City1")); 13 dt.Columns.Add(new DataColumn("Country1")); 14 dt.Columns.Add(new DataColumn("AccountNumber2")); 15 dt.Columns.Add(new DataColumn("AccountName2")); 16 dt.Columns.Add(new DataColumn("City2")); 17 dt.Columns.Add(new DataColumn("Country2")); 18 DataRow dr = dt.NewRow(); 19 for (int i = 0; i < 60; i++) 20 { 21 dr = dt.NewRow(); 22 dr["AccountName"] = "Test" + i; 23 dr["AccountNumber11111111111111111111"] = "100" + i; 24 dr["Country"] = "China" + i; 25 dr["City"] = "Beijing" + i; 26 dr["AccountName1"] = "Test" + i; 27 dr["AccountNumber1"] = "100" + i; 28 dr["Country1"] = "China" + i; 29 dr["City1"] = "Beijing" + i; 30 dr["AccountName2"] = "Test" + i; 31 dr["AccountNumber2"] = "100" + i; 32 dr["Country2"] = "China" + i; 33 dr["City2"] = "Beijing" + i; 34 dt.Rows.Add(dr); 35 } 36 GridView1.DataSource = dt; 37 GridView1.DataBind(); 38 } 39 }