【问题标题】:Alternate row color for long table长表的备用行颜色
【发布时间】:2014-04-19 06:43:21
【问题描述】:

如果行数大于一定数量,是否可以为表格行提供交替颜色?

如果我这样做:

tr                {background-color: white;}
tr:nth-child(even){background-color: gray;}

那么无论行数如何,它都会提供替代颜色。如果我尝试将其限制为具有五行或更多行的表并执行以下操作:

tr                {background-color: white;}
tr:nth-child(2n+5){background-color: gray;}

然后,正如预期的那样,短表不会改变,但长表中的前四行也不会改变。

【问题讨论】:

  • 如果您使用 php 生成行,而不是在生成行时,您可以计算行数,如果它是第五行(或更大),您希望使用不同的颜色,添加另一个类它。

标签: css colors row


【解决方案1】:

而不是nth:child() 使用nth-of-type() 这在这里更好,比如如果在a 标记之间生成任何动态元素,您的选择器将中断。使用nth:typehttp://jsfiddle.net/FKZtn/22/的基本演示

【讨论】:

  • 你做过什么样的demo?它应该是一个表格,并且至少应该有 5 行以上,然后才会应用样式。如果注释掉行数使得行数小于或等于 5,则不会应用样式。
猜你喜欢
  • 1970-01-01
  • 2011-09-22
  • 2016-08-18
  • 2015-01-27
  • 1970-01-01
  • 2019-01-06
  • 1970-01-01
  • 1970-01-01
  • 2012-03-26
相关资源
最近更新 更多