圆角按钮ASP.NET

Question

我想在我的asp.net应用程序中使用圆角按钮。我们在ASP.NET 3.5中有什么可以帮助我们制作圆角按钮吗？

Answer 1

这是我正在使用的控件和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;
}

Answer 2

您可以使用具有圆角扩展器的ajax控件工具包。就个人而言，我从未在项目中使用它。我使用css3 border-radius并让IE用户使用方形边框，直到他们的浏览器赶上（http://www.cssportal.com/css3-rounded-corner）

以下是控制扩展器示例的链接。 http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/RoundedCorners/RoundedCorners.aspx

Answer 3

如何将CSS样式应用于按钮？

Sample code, demo, tutorial at Oscar Alexander

使用那里的代码，您可以确保所有按钮完全按照您的要求获得样式。

Answer 4

正如p.cambell告诉你的那样，这个链接上的技术很有用：http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html

但是您必须使用HyperLink服务器控件替换“按钮”服务器控件，这是因为css应用于“a”标签。

因此，在Visual Studio中，而是绘制一个按钮，使用CssClass =“button”绘制HyperLink

再见！