43

これは私のasp:buttonコードで、font awesomeのアイコンをレンダリングしていませんが、代わりにHTMLをそのまま表示しています。

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

この問題をどのように解決できますか?

4

9 に答える 9

71

デフォルトの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>
于 2013-02-25T09:45:22.920 に答える
40

LinkBut​​tonを使用できます

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

テキストフィールドでhtmlをサポートします。

于 2014-10-26T05:44:56.257 に答える
17

純粋に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:インストール-パッケージFontAwesome-ASP.NET

ソース:https ://github.com/kemmis/F​​ontAwesome-ASP.NET

于 2015-04-14T13:53:22.607 に答える
9

LinkBut​​tonを使用する

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

于 2018-04-24T09:17:47.687 に答える
3

このソリューションを試すこともできます-

<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>
于 2016-04-07T11:05:30.753 に答える
1

他の回答では、asp:buttonを他のものに変更します。asp:buttonを使用するかどうかを示します。簡単です:)

/*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>

于 2017-03-09T22:34:49.910 に答える
0

Nugetで入手してください!

インストール-パッケージFontAwesome-ASP.NETの使用法

WebフォームボタンのFontAwesomeアイコン

asp.netwebformsボタンコントロール内でFontAwesomeアイコンを使用できます。FontAwesome.Iconsクラスの静的プロパティから選択したアイコンにデータバインドするだけです。次に、ボタンでDataBind()を呼び出すか、親コントロールまたはページでDataBind()を呼び出します。

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

于 2017-02-11T18:48:49.717 に答える
0

これをLoadフォームメソッドに入れます。

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

そしてCssClassボタン:

CssClass="fa"

于 2021-03-17T23:15:52.457 に答える
0

このコードはv5.15で機能しました

wwwrootの下のfontsという名前のフォルダに次のファイルを追加する必要がありました

  1. FontAwesome.otf
  2. fontawesome-webfront.eot
  3. fontawesome-webfront.svg
  4. fontawesome-webfront.ttf
  5. fontawesome-webfront.woff
  6. 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>

于 2021-06-24T21:30:18.790 に答える