Question

这是我的asp：按钮代码，它不会呈现字体真棒的图标，而是显示HTML原样：

  <asp:Button runat="server" ID="btnRun" Text="<i class='icon-camera-retro'></i> Search" ValidationGroup="edt" OnClick="btnRun_Click"  CssClass="greenButton"/>

我知道如何解决这个问题？

Answer 1

你不能使用默认的asp.net按钮，你需要使用HTML按钮并给它runat = server属性：

<button runat="server" id="btnRun" class="btn btn-mini" title="Search">
    <i class="icon-camera-retro"></i> Search
</button>

所以使用后面的代码添加：

onserverclick="functionName"

按钮，然后在C＃中执行：

protected void functionName(object sender, EventArgs e)
{
    Response.Write("Hello World!!!");
}

所以最终按钮看起来像：

<button runat="server" id="btnRun" onserverclick="functionName" class="btn btn-mini" title="Search">
    <i class="icon-camera-retro"></i> Search
</button>

Answer 2

您可以使用LinkButton

<asp:LinkButton runat="server" ID="btnRun" Text="<i class='icon-camera-retro'></i> Search" 
                ValidationGroup="edt" OnClick="btnRun_Click" CssClass="greenButton" />

他们在文本字段中支持html。

Answer 3

你可以做到这一点，但不仅仅是CSS。您只需要将按钮上的Text属性设置为fontawesome字符的unicode值，并将按钮设置为'fa'css类，以便它占用fontawesome字体。

<asp:Button ID="Button1" runat="server" 
    Text="\xF135" CssClass="fa" />

我创建了这个帮助程序库，它提供了强类型的所有图标代码，如果它可以改变你的曲柄：

<asp:Button ID="Button1" runat="server" 
    Text="<%# FontAwesome.Icons.Rocket %>" CssClass="fa" />

Nuget：Install-Package FontAwesome-ASP.NET

来源：https://github.com/kemmis/FontAwesome-ASP.NET

Answer 4

使用LinkButton

<asp:LinkButton runat="server" ID="btnRun" ValidationGroup="edt" OnClick="btnRun_Click" CssClass="greenButton" > <i class='icon-camera-retro'></i> Search </asp:LinkButton>

Answer 5

您也可以尝试此解决方案 -

<span  style="position:relative;">
    <i class="fa fa-hand-o-down"></i>
    <asp:Button ID="btnCatMoveDown" CssClass="movedown" CausesValidation="false" Text="" CommandName="categorymovedown" CommandArgument='<%#Eval("SomeId")%>' runat="server"></asp:Button>
</span>

<style>
    .movedown {
        position:absolute;
        opacity:0;
        top:0;
        left:0;
        width:100%;
        height:100%;
    }
</style>

Answer 6

在其他答案中更改asp：按钮由另一个，我告诉你是否要使用asp：按钮，EASY：）

/*CSS*/
/*Colors depends what btn you use, in this case i´m using btn-default*/

.btn_asp_icon{
    border: 0;
    background-color: #fff;
}

.btn:hover > .btn_asp_icon{
    background-color: #e6e6e6;
}

<!-- HTML -->

<div class="btn btn-default">

<i class="fa fa-search fa-fw fa-lg" aria-hidden="true"></i>
<asp:Button cssClass="btn_asp_icon" runat="server" text="Consultar"/>   

</div>

Answer 7

在Nuget上获取它！

Install-Package FontAwesome-ASP.NET 使用

Webforms按钮中的FontAwesome图标

您可以在asp.net webforms按钮控件中使用FontAwesome图标。只需从FontAwesome.Icons类中将数据绑定到您选择的图标即可。静态属性。然后调用按钮上的DataBind（）或父控件或页面上的DataBind（）。

＆＃13;

<asp:Button ID="Button1" runat="server" 
    Text="<%# FontAwesome.Icons.Rocket %>" CssClass="fa" />

＆＃13;

Answer 8

将其放入您的加载表单方法中：

btn_Test.Text = "Hello " + FontAwesome.Icons.LongArrowRight;

还有 CssClass 按钮：

CssClass="fa"

Answer 9

此代码适用于 v5.15

我必须将以下文件添加到 wwwroot 下名为 fonts 的文件夹中

FontAwesome.otf
fontawesome-webfront.eot
fontawesome-webfront.svg
fontawesome-webfront.ttf
fontawesome-webfront.woff
fontawesome-webfront.woff2

<div>
    <a asp-controller="Controller" asp-action="CSHTMLFILE"><i class="fa fa-1x fa-arrow-left "></i> Go Back to Previous Page</a>  
</div>

asp按钮内的字体很棒

9 个答案: