【问题标题】:Rounded Corner Button ASP.NET圆角按钮 ASP.NET
【发布时间】:2011-05-04 17:39:48
【问题描述】:

我想在我的 asp.net 应用程序中使用圆角按钮。我们在 ASP.NET 3.5 中是否有任何东西可以帮助我们制作圆角按钮?

【问题讨论】:

  • 试试 CSS3PIE。它会让你的生活更轻松...看看我的博尔格页面:[Internet Explorer 6-8 没有 CSS 边框半径。如何制作圆角? ](blog.robertolopes.com/2011/02/18/…) 干杯!罗伯托。
  • @Roberto 您发布的链接是 404。
  • @ChrisW 感谢您的提醒。链接已修复。

标签: asp.net button rounded-corners


【解决方案1】:

如何将 CSS 样式应用到您的按钮?

Sample code, demo, tutorial at Oscar Alexander

使用那里的代码,您可以确保所有按钮都获得您想要的样式。

【讨论】:

  • 谢谢,我会尝试使用您发布的 CSS 链接..!!
  • 我尝试了为 ASP.NET 按钮提供的 CSS,它不起作用...还有其他可用的 CSS 吗?
【解决方案2】:

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

【讨论】:

    【解决方案3】:

    您可以使用具有圆角扩展器的 ajax 控件工具包。我个人从未在项目中使用过它。我使用 css3 边框半径,只是让 IE 用户使用方形边框,直到他们的浏览器赶上 (http://www.cssportal.com/css3-rounded-corner)

    这里是控制扩展程序示例的链接。 http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/RoundedCorners/RoundedCorners.aspx

    【讨论】:

      【解决方案4】:

      正如 p.cambell 告诉您的,此链接上的技术效果很好:http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html

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

      因此,在 Visual Studio 中,改为绘制一个按钮,使用 CssClass="button" 绘制一个 HyperLink

      再见!

      【讨论】:

        猜你喜欢
        • 2019-05-17
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-10-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多