在GridView中交错行/列颜色

时间:2008-11-24 19:05:28

标签: asp.net css gridview

假设您有一个包含以下几列的GridView:

| Foo |酒吧|总计|

并使用样式表使交替行的颜色不同,例如浅蓝色和白色。

有没有一种方法可以使特定的列以不同的颜色交替?例如,我可能希望Total列以中等和浅红色交替以在大网格中引起注意。

BTW,我知道你可以通过编程方式改变单元格的颜色。如果可能的话,我想坚持使用CSS,所以我所有的风格都在一个地方。当我进入事件处理程序时,我也没有看到一个简单的方法来判断我是否处于交替行。

4 个答案:

答案 0 :(得分:4)

如果你正在使用jQuery,你可以很容易地做到这一点。

$("table#myTable col:odd").css("background-color:#ffe");

:odd选择器在大多数当前浏览器中都不可用,但是今天jQuery将它提供给我们。

对于行,您可以使用内置的AlternatingRowStyle元素。

编辑:为不同的方法找到了一个很好的资源:http://css-discuss.incutio.com/?page=StylingColumns

答案 1 :(得分:0)

除了Ben's suggestion之外,Matt Berseth还有一个非常好的演示,如何使用GridViewControlExtender对列进行翻转突出显示非常好:

http://mattberseth2.com/demo/Default.aspx?Name=GridViewControlExtender+II+-+Header+Cell+MouseOver+Styles+and+a+Few+More+Live+Examples&Filter=All

关于如何在他的网站上增强GridView,还有很多其他的东西:

http://mattberseth.com/blog/gridview/

相当多的示例使用ASP.NET Ajax和Ajax Control Toolkit位,但它们并不太难以移植到轻量级jQuery等效项。

答案 2 :(得分:0)

在这里切断2个切线......

P.S。 “当我进入事件处理程序时,也看不出一个简单的方法来判断我是否处于交替行。”

Row.RowState == RowState.Alternating

此外,您始终可以在ASP.NET中的相应单元格上设置CssClass,然后在css中定义该类。

答案 3 :(得分:0)

我在搜索有关WPF ListView的{​​{1}}的相同问题时发现了这一点。在那里,答案是使用Bea Costa描述的StyleSelector like this one

GridView

有一些尼特可以让它真正发挥作用,这些都在她的博客文章中有描述。

有一点值得帮助的是,这只适用于行。列似乎始终必须使用public class ListViewItemStyleSelector : StyleSelector { private int i = 0; public override Style SelectStyle(object item, DependencyObject container) { // makes sure the first item always gets the first style, even when restyling ItemsControl ic = ItemsControl.ItemsControlFromItemContainer(container); if (item == ic.Items[0]) { i = 0; } string styleKey; if (i % 2 == 0) { styleKey = “ListViewItemStyle1″; } else { styleKey = “ListViewItemStyle2″; } i++; return (Style)(ic.FindResource(styleKey)); } } / CellTemplate