Question

我有如下的Css gridview。我试着在上面盘旋。但是我的某些行不能正常工作

  <style type="text/css">
        .gridview
        {
            font-family: "arial";
            background-color: #FFFFFF;
            width: 100%;
            font-size: small;
        }
        .gridview th
        {
            background: #7AC142;
            padding: 5px;
            font-size: small;
        }
        .gridview th a
        {
            color: #003300;
            text-decoration: none;
        }
        .gridview td
        {
            background: #D9EDC9;
            color: #333333;
            font: small "arial";
            padding: 4px;
        }
        .gridview tr.even td
        {
            background: #FFFFFF;
        }
        .rows
        {
            background-color: #fff;
            font-family: Arial;
            font-size: 14px;
            color: #000;
            min-height: 25px;
            text-align: left;
            border: none 0px transparent;
        }
        .rows:hover td
        {
            background-color: #ff8000;
            font-family: Arial;
            color: #fff;
            text-align: left;
        }
        .selectedrow
        {
            background-color: #ff8000;
            font-family: Arial;
            color: #fff;
            font-weight: bold;
            text-align: left;
        }
        .gridview td a:hover
        {
            background-color: #ff8000;
            font-family: Arial;
            color: #fff;
            text-align: left;
        }
    </style>

以下是我的gridview

<asp:GridView ID="gvAsset" RowStyle-CssClass="rows" CssClass="gridview" AlternatingRowStyle-CssClass="even"
    runat="server" OnRowCommand="gvAsset_RowCommand" EmptyDataText="No Record Available"
    AutoGenerateColumns="False" AllowSorting="True" AllowPaging="False" DataKeyNames="Asset_ID"
    Width="100%" OnSorting="gvAsset_Sorting" OnRowDataBound="gvAsset_RowDataBound">
    <RowStyle />
    <AlternatingRowStyle />
    <HeaderStyle />
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:UpdatePanel ID="updPanel2" runat="server">
                    <ContentTemplate>
                        <asp:LinkButton ID="lnkEdit" CommandName="EditRow" CommandArgument='<%# Eval("Asset_ID") %>'
                            runat="server">Edit</asp:LinkButton>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField ReadOnly="True" DataField="Asset_ID" SortExpression="Asset_ID" HeaderText="ID"></asp:BoundField>
    </Columns>
    <PagerStyle HorizontalAlign="Center"></PagerStyle>
</asp:GridView>

我的css悬停工作在第一行，但不在第二行。然后第三行正在工作，但不是第四行，依此类推。（它不是在偶数行中工作）我不擅长CSS我尝试将hover或td从一行css代码更改为另一行css代码，但它仍然无效。

Answer 1

将.rows:hover td更改为

.rows:hover td, .even:hover td
{
    background-color: #ff8000 !important;
    font-family: Arial;
    color: #fff;
    text-align: left;
}

背景颜色之后的!important是nessecary，因为您在.gridview tr.even td中设置了白色背景。

鼠标悬停在Gridview ASP.net中使用CSS无法正常工作

1 个答案: