Question

我正在使用devexpress的aspxgridview。我在细胞上应用了不同的细胞样式。现在我想将交替的网格行作为阴影（相同颜色的光）。我正在应用交替颜色，但即使设置了cellstyle-color也不适用。任何人都有这个想法。提前谢谢。

Answer 1

我建议您使用DevExpress css样式（而不是设置ASPxGridView的属性），如下所示：

.dxgvDataRow:hover
 {
   color: gray;
 }

您还可以使用ASPxGridView的CssPostfix属性为控件设置不同的样式。例如：

<dx:ASPxGridView ID="grid" runat="server"  Styles-CssPostfix="MyGrid" ...

将使用以下css：

.dxgvDataRow_MyGrid:hover
 {
   color: gray;
 }

要观察ASPx css类名，只需在开发模式下打开浏览器并查看源代码，就可以找到这样的类：dxgvDataRowHover，dxgvFocusedRow，dxgvSelectedRow等等。

这种样式定制的优点是html标记不会为每个html元素创建样式属性，css编辑更容易，更快，并且不需要通过设置其属性来自定义每个ASPxGridView控件。

Answer 2

感谢Anton，但我已经用javascript完成了。我正在使用像下面这样的偶数和奇数的表格。这是我在document.ready函数中调用的函数。并且还从服务器端调用每个按钮的单击事件。

function colorGrid（）{

        /*code for color coding grid*/
        $(".student_account td table tbody tr'[id]':odd").addClass('initial');
        $(".student_account td table tbody tr'[id]':even").addClass('initial');

        /* For odd Rows */

        // for first 3 columns
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(1)").css("background-color", "#EEEEEE");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(2)").css("background-color", "#EEEEEE");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(3)").css("background-color", "#EEEEEE");

        // for 4th and 5th column
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(4)").css("background-color", "#EBFAE3");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(5)").css("background-color", "#EBFAE3");


        // for 6th t0 9th column
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(6)").css("background-color", "#F7F8D6");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(7)").css("background-color", "#F7F8D6");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(8)").css("background-color", "#F7F8D6");
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(9)").css("background-color", "#F7F8D6");


        // for 10th column
        $(".student_account td table tbody tr'[id]':odd  td:nth-child(10)").css("background-color", "#CBE6F7");



        /* For Even Rows */

        var name = "ctl00_ContentPlaceHolder1_grdScheduleStudent_DXHeadersRow";

        // for first 3 columns
        $(".student_account td table tbody tr'[id]':even  td:nth-child(1)").css("background-color", "#FFFFFF");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(2)").css("background-color", "#FFFFFF");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(3)").css("background-color", "#FFFFFF");

        // for 4th and 5th column
        $(".student_account td table tbody tr'[id]':even  td:nth-child(4)").css("background-color", "#F5FAF3");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(5)").css("background-color", "#F5FAF3");


        // for 6th t0 9th column
        $(".student_account td table tbody tr'[id]':even  td:nth-child(6)").css("background-color", "#FBFCEA");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(7)").css("background-color", "#FBFCEA");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(8)").css("background-color", "#FBFCEA");
        $(".student_account td table tbody tr'[id]':even  td:nth-child(9)").css("background-color", "#FBFCEA");


        // for 10th column
        $(".student_account td table tbody tr'[id]':even  td:nth-child(10)").css("background-color", "#EDF8FE");

        $(".student_account td table tbody tr'[id=" + name + "]' td").css("background-color", "#56A52E");

        /*end color coding*/
    }

如何在aspx gridview中同时应用单元格颜色和交替行颜色

2 个答案: