行之間顏色間隔:
gridview:<AlternatingRowStyle ForeColor="#ffffff" BackColor="#ECECEC" /> datalist/datagrid:<AlternatingItemStyle ForeColor="#ffffff" BackColor="#ECECEC" /> 鼠標(biāo)滑過顏色變化: 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: 這個用類似上面的方式好像沒有效果,所以可以考慮在頁面去實現(xiàn): 代碼 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中實現(xiàn).... |
|
來自: 悟靜 > 《.net和asp.net》