gridview行颜色渐变实例代码


 行之间颜色间隔:

  gridview:<AlternatingRowStyle ForeColor="#ffffff" BackColor="#ECECEC" />

  datalist/datagrid:<AlternatingItemStyle ForeColor="#ffffff" BackColor="#ECECEC" />

  鼠标滑过颜色变化:

  gridview:

  代码

  1 protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

  2     {

  3         if (e.Row.RowType == DataControlRowType.DataRow)

  4         {

  5             e.Row.Attributes.Add("onmouseover", "currentColor=this.style.backgroundColor;this.style.backgroundColor='#E8D098'");

  6             e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentColor");

  //单击行改变行背景颜色

  e.Row.Attributes.Add("onclick","this.style.backgroundColor='颜色'; this.style.color='buttontext';this.style.cursor='default';");

  7         }

  8     }

  datagird:

  代码

  1 protected void dgValueInfo_ItemDataBound(object sender, DataGridItemEventArgs e)

  2     {

  3         if (e.Item.ItemIndex != -1)

  4         {

  5             e.Item.Cells[0].Text = (e.Item.ItemIndex + 1).ToString();

  6             ListItemType itemType = e.Item.ItemType;

  7              if (itemType == ListItemType.Item)

  8             {

  9                 e.Item.Attributes.Add("onmouseover", "e=this.style.backgroundColor; this.style.backgroundColor='#FBF9F9'");

  10                 e.Item.Attributes.Add("onmouseout", "this.style.backgroundColor=e");

  11             }

  12          }

  13    }

  datalist:

  这个用类似上面的方式好像没有效果,所以可以考虑在页面去实现:

  代码

  1   <asp:DataList ID="dlMain" runat="server" >

  2      <AlternatingItemStyle ForeColor="#ffffff" BackColor="#ECECEC" />

  3       <HeaderTemplate>

  4         <asp:Table ID="tabHeader" runat="server" CssClass="gridviewHead">

  5           <asp:TableRow CssClass="Header">

  6               <asp:TableCell CssClass="gridviewHead">序号 </asp:TableCell>

  7           </asp:TableRow>

  8         </asp:Table>

  9       </HeaderTemplate>

  10        <ItemTemplate>

  11           <asp:Table ID="tabItem" runat="server" CssClass="GridTableTDCenter">

  12             <asp:TableRow onmouseover="currentColor=this.style.backgroundColor;this.style.backgroundColor='#FBF9F9'"     onmouseout="this.style.backgroundColor=currentColor>

  13              <asp:TableCell CssClass="GridTableTDCenter"><#Container.ItemIndex+1%></asp:TableCell>

  14            </asp:TableRow>

  15          </asp:Table>

  16     </ItemTemplate>

  17  </asp:DataList>

  或者有table,则在tr中实现....


« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3