一个不错的GridView样式

样式表：

代码

  < style >
        .GridViewStyle   
        {   
            font - family: Arial, Sans - Serif;   
            font - size:small;   
            table - layout: auto;   
            border - collapse: collapse;   
            border:#B3D08F 1px solid;   
        }   
         /* Header and Pager styles */   
        .HeaderStyle   
        {   
            background - image:url(.. / images / HeaderWhiteChrome.jpg);   
            background - position: center  50 % ;   
            background - repeat: repeat - x;   
            color:# 009 ;   
            font - size:12px;   
          
               
        }   
          
        .PagerStyle   
        {   
            background - image:url(.. / images / tab_14.gif);   
            background - position: center  50 % ;   
            background - repeat: repeat - x;   
            color:# 009 ;   
            font - size:12px;   
          
               
        }   
        .HeaderStyle th   
        {   
            padding: 5px;   
            color: # 009 ;   
        }   
        .HeaderStyle a   
        {   
            text - decoration:none;   
            color:#ffffff;   
            display:block;   
            text - align:left;   
            font - weight:normal;   
        }   
        .PagerStyle table   
        {   
            text - align:center;   
            margin:auto;   
        }   
        .PagerStyle table td   
        {   
            border:0px;   
            padding:5px;   
        }   
        .PagerStyle td   
        {   
            border - top: #1d1d1d 1px solid;   
        }   
        .PagerStyle a   
        {   
            color:# 000000 ;   
            text - decoration:none;   
            padding:2px 10px 2px 10px;   
            border - top:solid 1px # 777777 ;   
            border - right:solid 1px # 333333 ;   
            border - bottom:solid 1px # 333333 ;   
            border - left:solid 1px # 777777 ;   
        }   
        .PagerStyle span   
        {   
            font - weight:bold;   
            color:# 000000 ;   
            text - decoration:none;   
            padding:2px 10px 2px 10px;   
        }   
         /* RowStyles */   
        .RowStyle td, .AltRowStyle td, .SelectedRowStyle td, .EditRowStyle td  /* Common Styles */   
        {   
            padding: 5px;   
            border: solid 1px #B3D08F;   
        }   
        .RowStyle td   
        {   
            background - color: #ffffff;   
        }   
        .AltRowStyle td   
        {   
            background - color: #f0f0f0;   
        }   
        .SelectedRowStyle td   
        {   
            background - color: #ffff66;   
        }  

         
</ style >

 

 

GridView定义：

代码

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="true" CssClass="GridViewStyle" GridLines="Horizontal" PageSize="20" Width="422px">   
            
 <RowStyle CssClass="RowStyle" />   
         
 <PagerStyle CssClass="PagerStyle" />   
  
 <SelectedRowStyle CssClass="SelectedRowStyle" />   
  
 <HeaderStyle CssClass="HeaderStyle" BorderColor="#404040" />   
  
 <EditRowStyle CssClass="EditRowStyle" />   
  
 <AlternatingRowStyle CssClass="AltRowStyle" />   
</asp:GridView>

 

 

 

转载于:https://www.cnblogs.com/lmjob/archive/2009/12/12/1622590.html