加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程开发 > asp.Net > 正文

圆角按钮ASP.NET

发布时间:2020-12-16 06:36:42 所属栏目:asp.Net 来源:网络整理
导读:我想在我的asp.net应用程序中使用圆角按钮.我们在ASP.NET 3.5中有什么可以帮助我们制作圆角按钮吗? 解决方法 这是我正在使用的控件和CSS.我的按钮是方形的,但事实并非如此.您可以自己创建圆形图像. asp:LinkButton ID="lbtnSignIn" class="button" runat="s
我想在我的asp.net应用程序中使用圆角按钮.我们在ASP.NET 3.5中有什么可以帮助我们制作圆角按钮吗?

解决方法

这是我正在使用的控件和CSS.我的按钮是方形的,但事实并非如此.您可以自己创建圆形图像.

<asp:LinkButton ID="lbtnSignIn" class="button" runat="server" OnClick="lbtnSignIn_Click"><span>Sign In</span></asp:LinkButton>

.button
{   
    background: transparent url('../../Images/ButtonLeft.gif') no-repeat top left;  
    display: block;
    float: left;
    line-height: 11px; /* 21px (Button Background) = 5px (padding-top) + 11px (font-size) + 5px(padding-bottom) */
    height: 21px; /* Button Background Height */
    padding-left: 9px;  
    text-decoration: none;
    font-weight: bold;
    color: white;
    font-size: 11px;    
}

a:link.button,a:visited.button,a:active.button
{
    color: white;
    text-decoration: none;
    margin-right: 10px;
}

a.button:hover
{ 
    background-position: bottom left;
}

a.button span,a.button span 
{
    background: transparent url('../../Images/ButtonRight.gif') no-repeat top right;    
    display: block;
    padding: 5px 9px 5px 0; /*Set 9px below to match value of 'padding-left' value above*/
}

a.button:hover span
{ 
    background-position: bottom right;
    color: white;
}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读