使用 css 在鼠标悬停时更改 asp.net 按钮的颜色

Posted 2023-05-09

【中文标题】使用 css 在鼠标悬停时更改 asp.net 按钮的颜色

【英文标题】：Change color of an asp.net button on mouse hover using css

【发布时间】：2013-09-10 23:38:41

【问题描述】：

我有一个按钮：

<div class="HeaderBarThreshold">
     <asp:LinkButton ID="SetThreshold" OnClick="btnSetThreshold_Click" runat="server">Threshold</asp:LinkButton>
</div>

我正在尝试更改鼠标悬停时按钮的颜色：

这是我的CSS：

.HeaderBarThreshold

    padding-left: 10px;
    font-weight: bold;

.HeaderBarThreshold:hover

    color: Red;      

它不工作。请告诉我。

【参考方案1】：

尝试使用 ASP.NET 控件的 CssClass 属性。这将直接将 LinkBut​​ton 本身指向 CSS 类，而不必使用 div 标签。例如：

<asp:LinkButton ID="SetThreshold" OnClick="btnSetThreshold_Click" runat="server" CssClass="HeaderBarThreshold">Threshold</asp:LinkButton>

【参考方案2】：

这是一个小提琴http://jsfiddle.net/zpfw7/

    .HeaderBarThreshold
    
    padding-left: 10px;
    font-weight: bold;
    width:300px;
    height:30px;
    border:1px solid #000;
    text-align:center;
    
    .HeaderBarThreshold:hover
    
    color: Red; 
    background:blue;
    

【讨论】：

这不适用于 Visual Studio 2019 中的 ASP.NET Web 表单。

【参考方案3】：

试试这个：

.HeaderBarThreshold a:hover

    color: Red;      

【参考方案4】：

将 CSS 类属性添加到您的 Web 控件

<asp:LinkButton CSSClass="HeaderBarThreshold" ID="SetThreshold" OnClick="btnSetThreshold_Click" runat="server">Threshold</asp:LinkButton>

你的 CSS 也是错误的，因为你没有为类“HeaderBarThreshold”分配任何东西。

【参考方案5】：

试试这个

.HeaderBarThreshold:hover a

     color: Red !important; // !important may not be necessary 

【参考方案6】：

.upda_link 
    font-size: 15px !important;
    color: white;
    font-weight: bolder;


.upda_link:hover 
    text-decoration: none;
    color: white;


<asp:LinkButton ID="LinkButton1" runat="server" Text="Update" CssClass="upda_link" CausesValidation="false">
</asp:LinkButton>