如何为tr的css类添加悬停?

时间:2014-08-13 14:11:21

标签: html css asp.net html-table

如何在CSS文件中为此类添加悬停?当我没有使用onmouseover来指定这个类时,我可以添加一个悬停效果,但是我想同时使用这个CSS类和悬停。

tr.TableData td
{  
    background-color:white;  
    color:Black;  
    font-family:'Exo', sans-serif;  
    font-size: 16px;  
    height:60px;
    border-bottom:1pt solid #E2E2E8;
    padding: 0px 15px 0px 15px;  
    margin:0px; 
    width:199px;
    font-weight:400;
}

这是我的桌子。它是listview中的ItemTemplate:

<ItemTemplate>
    <tr class="TableData">
        <td style="width: 30%;">
            <table>
                <tr class="NoBorder">
                    <td style="width: 20%;">
                        <img src='<%#Eval("standard_image") %>' alt="" width="80" onerror="this.src='Content/Images/placeholder.png';" />
                    </td>
                    <td>
                        <asp:Label ID="lblProductLine" runat="server" Text='<%#Eval("product_line")%>' />
                    </td>
                </tr>
            </table>
        </td>
        <td style="width: 24%;">
            <asp:Label ID="lblModelNum" runat="server" Text='<%#Eval("model")%>' />
        </td>
        <td style="width: 16%;">
            <asp:Label ID="lblSerialNum" runat="server" Text='<%#Eval("serial_number")%>' />
        </td>
        <td style="width: 12%; text-align:center;">
            <asp:LinkButton runat="server" ID="SelectCategoryButton" CommandName="Select">
                <img id="Img1" runat="server" src='<%#Eval("display_status") %>' alt="" width="20" />
            </asp:LinkButton>
        </td>
        <td style="width: 18%; text-align:right;">
            <asp:Label ID="lblShipDate" runat="server" Text='<%#Eval("date")%>' />
        </td>
    </tr>
</ItemTemplate>

1 个答案:

答案 0 :(得分:1)

如果你的意思是对表格单元格有悬停效果,那么这应该有效:

tr.TableData td:hover {  
    background-color: red;  
}