如何使用纯 CSS 在 GridView 中交替行颜色？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2413211/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to alternate rowcolor in a GridView using pure CSS?
提问by tbone
I want to alternate rowcolor in a GridView, using pure CSS, ie: I don't want to use asp.net themes; I'd rather not have to use jQuery, or define define AlternatingRowStyle-BackColor on each gridview (unless there's a reason I must).
我想在 GridView 中使用纯 CSS 替换 rowcolor，即：我不想使用 asp.net 主题；我宁愿不必使用 jQuery，也不想在每个 gridview 上定义定义 AlternatingRowStyle-BackColor（除非有我必须的原因）。
Here's my CSS (that isn't working):
这是我的 CSS（不起作用）：
.gridView {font-size:11px
}
.gridView tr:nth-child(even) {background-color: #FFF}
.gridView tr:nth-child(odd) {background-color: #FFCC00}
.gridView tr:nth-child(even) td {background-color: #FFF}
.gridView tr:nth-child(odd) td {background-color: #FFCC00}
(I included the .gridView {font-size:11px} just to confirm I am using the proper CssClass.)
（我包含了 .gridView {font-size:11px} 只是为了确认我使用的是正确的 CssClass。）
Is this not possible, or am I doing something wrong.
这是不可能的，还是我做错了什么。
回答by Dustin Laine
You are using CSS3, which is not supported by all browsers. To do this in a cross-browser compatible way you need to use alternating class, jQuery, or some other method to do this.
您正在使用 CSS3，并非所有浏览器都支持它。要以跨浏览器兼容的方式执行此操作，您需要使用交替类、jQuery 或其他一些方法来执行此操作。
The alternating class is a fairly elegant way to do so, IMHO.
恕我直言，交替类是一种相当优雅的方式。
UPDATE:This shows the gridview way:
更新：这显示了 gridview 方式：
<asp:gridview id="CustomersGridView" runat="server">
<RowStyle CssClass="Row" />
<AlternatingRowStyle CssClass="AltRow" />
</asp:gridview>
