Datagrid可以自动套用样式,但是如果我们自己需要定制样式,可以通过属性生成器来实现,除此之外一个更为强大的功能就是为他定制样式表,或者编写STYLE属性.
下面举一个例子,这个例子来源与www.codeproject.com
窗体名MyGrid.aspx
第一步:在一个空白窗体上添加一个Datagrid控件
第二步:切换到html文档视图,添加如下代码:
<asp:DataGrid id="DataGrid2" runat="server" AllowSorting="True" CssClass="Grid" AllowPaging="True">
<AlternatingItemStyle CssClass="GridAltItem"></AlternatingItemStyle>
<ItemStyle CssClass="GridItem"></ItemStyle>
<HeaderStyle CssClass="GridHeader"></HeaderStyle>
<PagerStyle CssClass="GridPager"></PagerStyle>
</asp:DataGrid>
在<head></head>区内添加:
<LINK title="Tan" media="screen" href="styles.css" type="text/css" rel="stylesheet">
<LINK title="Blue" media="screen" href="styles2.css" type="text/css" rel="stylesheet">
<LINK title="print" media="print" href="printstyles.css" type="text/css" rel="stylesheet">
第三步:点击项目->添加新项->样式表,取名分别为:styles.css styles2.css,printstyles.css
其中styles.css的内容:
1H1
2
{
}{
3
font-size: medium;
4 color: peru;
5 font-family: Arial;
6
}
7
8.Grid
9{}{
10 border: solid 1px Tan;
11}
12
13.Grid td
14{}{
15 border: solid 3px #FFFFFF;
16 margin: 3px 3px 3px 3px;
17 font-family: Arial;
18 padding: 5px 5px 5px 5px;
19 text-align: center;
20}
21
22.GridHeader
23{}{
24 font-weight: bold;
25 background-color: Tan;
26}
27
28.GridHeader a
29{}{
30 text-decoration: none;
31 color: LightGoldenrodYellow;
32 padding: 0px 15px 0px 15px;
33}
34
35.GridHeader a:hover
36{}{
37 text-decoration: underline;
38 background: Tan url(images/spin.gif) no-repeat 0 100%;
39}
40
41.GridItem, .GridAltItem
42{}{
43 font-size: smaller;
44}
45
46.GridItem
47{}{
48 background-color: LightGoldenrodYellow;
49}
50
51.GridAltItem
52{}{
53 background-color: PaleGoldenrod;
54}
55
56.GridPager
57{}{
58 font-size: small;
59 background-color: LightGoldenrodYellow;
60}
第四步:填充datagrid数据,用您喜欢的方式
