如何在ASP.NET按钮中使用Twitter Bootstrap图标?

时间:2012-04-27 14:29:15

标签: asp.net twitter-bootstrap

我如何使用:

<i class="icon-etc"></i> 

使用asp.net按钮?

5 个答案:

答案 0 :(得分:18)

LinkBut​​ton,就像这样...

<asp:LinkButton ID="SelectButton" runat="server" CssClass="btn btn-info"><i class="icon-ok icon-white"></i>&nbsp;Select</asp:LinkButton>

答案 1 :(得分:10)

您可以将<i>标记作为值添加到LinkButton Text属性中。

<强> e.g。

<asp:LinkButton ID="btnExcluir" runat="server" Text="<i aria-hidden='true' class='icon-remove-3'></i>" CssClass="btn btn-danger" />

您甚至可以将其与旁边文本一起使用。

<强> e.g。

<asp:LinkButton ID="btnExcluir" runat="server" Text="Link Name&nbsp;<i aria-hidden='true' class='icon-remove-3'></i>" CssClass="btn btn-danger" />

答案 2 :(得分:6)

试试这个

<asp:LinkButton ID="btnExample" runat="server" Text="<span class='glyphicon glyphicon-repeat'></span> Button" CssClass="btn btn-primary btn-xs" OnClick="btn_Click"></asp:LinkButton>

<asp:LinkButton ID="btnExample" runat="server" Text="<i class='glyphicon glyphicon-flash'></i> Button" CssClass="btn btn-primary btn-xs" OnClick="btn_Click"></asp:LinkButton>

问候C:

答案 3 :(得分:0)

我这样做了。

标记:

<asp:PlaceHolder ID="phButtonToLabelsAdminBox" runat="server"></asp:PlaceHolder>
<asp:Button ID="btnSave" runat="server" CssClass="btn" Text="Spara" />
<asp:Button ID="btnClear" runat="server" CssClass="btn" Text="Töm/Ny" />

CodeBehind Page_Load()

FixGlyph(phButtonToLabelsAdminBox, btnSave, "icon-ok")
FixGlyph(phButtonToLabelsAdminBox, btnClear, "icon-refresh")

Sub:

Private Sub FixGlyph(ph As PlaceHolder, btn As Button, IconClass As String, Optional CustomLabelStyle As String = "")

If btn.Visible = False Then Exit Sub
Dim g As New HtmlGenericControl
g.ID = "labelFor_" + btn.ID
g.TagName = "label"
g.Attributes.Add("for", btn.ClientID)
g.Attributes.Add("class", "" + btn.CssClass + "")
If Not CustomLabelStyle = "" Then g.Attributes.Add("style", CustomLabelStyle)
g.InnerHtml = "<i class=""" + IconClass + """></i> " + btn.Text
ph.Controls.Add(g)
btn.Attributes.Add("style", "display:none;")

End Sub

我在我的标记中使用普通的asp:Button,唯一的事情就是在其他代码之后运行FixGlyph,这些代码可能会为按钮设置可见的true / false,并按照您希望按钮显示的顺序添加FixGlyph。除此之外,它对我有用。

答案 4 :(得分:0)

感谢Anders Smedman,您的代码确实完成了这项工作。 如果有人需要,这里是C#代码。

 private void FixGlyph(PlaceHolder ph, Button btn, string iconClass, string customLabelStye = "")
    {
        if (btn.Visible)
        {
            var g = new HtmlGenericControl();
            g.ID = "labelFor_" + btn.ID;
            g.TagName = "label";
            g.Attributes.Add("for",btn.ClientID);
            g.Attributes.Add("class","" + btn.CssClass +"");
            if (customLabelStye != "")
            {
                g.Attributes.Add("style",customLabelStye);
            }
            g.InnerHtml = "<i class='" + iconClass + "'></i> " + btn.Text;
            ph.Controls.Add(g);
            btn.Attributes.Add("style","display:none;");
        }

    }