条件替代表行样式 [英] Conditional alternative table row styles

问题描述

是否可以设置备用表行的样式而不在备用< tr> 标记上定义类？

Is it possible to style alternate table rows without defining classes on alternate <tr> tags?

使用下表，CSS可以定义备用行样式而不必为备用行提供类row1 / row2吗？ row1可以是默认值，因此row2就是问题。

With the following table, can CSS define alternate row styles WITHOUT having to give the alternate rows the class "row1/row2"? row1 can be default, so row2 is the issue.

<style>
.altTable td { }
.altTable .row2 td { background-color: #EEE; }
</style>

<table class="altTable">
 <thead><tr><td></td></tr></thead>
 <tbody>
  <tr><td></td></tr>
  <tr class="row2"><td></td></tr>
  <tr><td></td></tr>
  <tr class="row2"><td></td></tr>
 </tbody>
</table>

推荐答案

tr:nth-child(even) { background: #FFF; }
tr:nth-child(odd) { background: #EEE; }

在IE中不起作用，但它纯粹是表示性的，内容无论如何都能正常工作，所以我认为这不是一个大问题 - 取决于您网站上常规IE用户的百分比。

Does not work in IE, but it's a purely presentational thing, the content will work fine anyway, so I don't think it's a huge issue -- depending on the % of regular IE users on your site.

这篇关于条件替代表行样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！