button控件鼠标移动CSS效果

最新推荐文章于 2023-08-04 17:02:32 发布

原创最新推荐文章于 2023-08-04 17:02:32 发布 · 781 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#button #css #stylesheet #url #server

本文介绍了一种在ASP.NET中实现按钮样式的动态切换方法，通过鼠标悬停效果改变按钮背景图片及文字颜色，增强用户体验。该技术使用了内联样式、CSS类以及JavaScript事件处理。

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

//default

<asp:Button ID="Button1" runat="server" Text="Button" BackColor="White" CssClass="style1" onmouseover="this.className='style2'" onmouseout="this.className='style1'" />

//红色为关键点

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

//StyleSheet.css

input
{

background-color:white;

}

.style1
{
background-image: url(image/btn22.gif);
cursor: hand;
text-align: center;
}
.style2
{
background-image:url(image/btn22.gif);
background-repeat: no-repeat;
color: #203a85;
cursor: hand;
}

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。