仅使用ItemTemplate时如何为列表视图行创建交替的背景色? [英] How can I create alternating background colors for listview rows while only using ItemTemplate?

问题描述

仅使用ItemTemplate时如何为列表视图行创建交替的背景色?我不想使用AlternateTemplate，因为当我要使用它来创建交替的背景色时，每当我想更改某些内容时，都必须对它们进行编辑.那么我可以仅使用ItemTemplate来实现的方式是什么?谢谢！

How can I create alternating background colors for listview rows while only using ItemTemplate? I don't want to use AlternateTemplate because I would have to edit both of them everytime i want to change something when all I'm using it for is to create the alternating background colors. So what's a way I could do it using only the ItemTemplate? Thanks!

推荐答案

如果您可以将交替色视为一种渐进增强功能，而并非在所有(旧)浏览器中都绝对需要，那么您可以使用第n个CSS子选择器来应用颜色而无需更改HTML.

If you could consider the alternating colours a progressive enhancement and not absolutely required in all (old) browsers then you could use a CSS n-th child selector to apply the colour without changing the HTML.

如果您的项目中已经有jQuery(或类似版本)，并且想要旧版浏览器的解决方案，则可以使用该代码通过:odd或:even选择器选择每隔一行.

If you have jQuery (or similar) in your project already and want a solution for older browser, you could use that to select every other row with the :odd or :even selector.

更新(示例)

假设我们正在使用表格行

Assuming we are using table rows

tr:nth-child(odd) td{  
  background-color: red;  
}

您也可以使用even，2n或2n+1.这对于<li>标签同样适用.

You can also use even, 2n or 2n+1. This would work equally well with <li> tags.

更多示例: http://reference.sitepoint.com/css/pseudoclass-nthchild

这篇关于仅使用ItemTemplate时如何为列表视图行创建交替的背景色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！