Question

我有一个asp按钮控件，我已应用了一些样式。我希望在悬停此按钮时，按钮的颜色应该改变或类似的东西。但我不明白为什么在CSS中按钮悬停功能不起作用!! 请帮忙。另外，请告诉我们按钮悬停的最佳效果是什么。

    <asp:Button ID="btnSearch" runat="server" CssClass="button"  OnClick="btnSearch_Click"     Style="width: 480px;" Text="Search" />

.button
{
    background: white;
    border: solid 1px grey;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #001563;    
    height: 25px;  

}

.button:hover
{
    background: white;
    border: solid 1px grey;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: Red;   
    height: 25px;

}

Answer 1

请检查以下代码：

 <asp:Button ID="btnSearch" runat="server" OnClick="btnSearch_Click"  Style="width: 480px;" CssClass="button" Text="Search" />
      <style type="text/css">
.button
{
    background: white;
    border: solid 1px grey;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #001563;    
    height: 25px;  

}

.button:hover
{
    background: white;
    border: solid 1px grey;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: Red;   
    height: 25px;

}</style>

Answer 2

asp：按钮呈现为HTML输入（提交按钮）标签，因此您不能使用与超链接相同的CSS语法。

这应该适用于浏览器（MSIE除外）：

（注意：“按钮”是您的班级名称）

input.button:hover{
   color: Green;
}

或更改所有提交按钮：

input[type="submit"]:hover{
   color: Green;
}

如果您使用Google for CSS技术悬停在按钮上（输入按钮），那么您将找到一些更好的CSS和JavaScript技术。

Answer 3

让按钮的样式由操作系统决定。不要尝试修改此行为。大多数时候你都不会成功。

：hover伪类适用于用户指定元素（带有一些指点设备）但不激活它的情况。例如，当光标（鼠标指针）悬停在元素生成的框上时，可视用户代理可以应用此伪类。不支持交互式媒体的用户代理不必支持此伪类。支持交互式媒体的一些符合要求的用户代理可能无法支持该伪类（例如，笔设备）。

请参阅Selectors

如果您想将悬停效果应用于按钮，那么最好使用锚标记并使用其中的图像。

a:hover { }

Asp Button悬停和CSS

3 个答案: