web-dev-qa-db-ja.com

ASP.Netのasp：Button内にBootstrap Glyphiconを配置するにはどうすればよいですか？

プロジェクトでBootstrap 3を使用していますが、ASP.netボタンでBootstrap Glyphiconsを使用します。

うまくいきませんでしたが、使用したコードは次のとおりです（<span>タグの代わりにTwitter Bootstrap <i>タグを使用するサンプルがありました）。

<asp:Button ID="btnRandom"
    runat="server"
    Text="<span aria-hidden='true'
        class='glyphicon glyphicon-refresh'>
        </span>"
    onclick="btnRandom_Click" />

多分何か特別なことをする必要があります。

どのように動作させることができますか？返事を事前に感謝します。

htmlasp.nettwitter-bootstrapbuttonaspbutton
49
allence

asp：LinkBut​​tonの代わりにaaspを使用する必要があります：Button、ASP.NET Webアプリケーションで Bootstrap を使用する場合の動作を次に示します。

コードから、次の作業を実行できます。

<asp:LinkButton ID="btnRandom" 
            runat="server" 
            CssClass="btn btn-primary"    
            OnClick="btnRandom_Click">
    <span aria-hidden="true" class="glyphicon glyphicon-refresh"></span>
</asp:LinkButton>

ここに、「Submit」というテキストのSubmit Buttonに使用するものの例を示します。

<asp:LinkButton ID="SubmitBtn" 
                runat="server" 
                CssClass="btn btn-primary"    
                OnClick="SubmitBtn_Click">
    <span aria-hidden="true" class="glyphicon glyphicon-ok"></span>Submit
</asp:LinkButton>
89
lucidgold

HTMLサーバーコントロールでASP Serverコントロールを実際に使用できる場合

Runat = "server"属性を設定することにより、HTML要素をサーバーコントロールに変換できます。

<button runat="server" >
<span aria-hidden="true" class="glyphicon glyphicon-refresh"></span>Refresh
</button>
19
Mehdi Souregi

これを試して

<button id="btnSubSearch" runat="server" type="submit" class="btn btn-default" onserverclick="btnSubSearch_Click">
<span aria-hidden="true" class="glyphicon glyphicon-search">
</span>
</button>
6
Cubo Hayachi

その作業Asp：Buttonの場合グリフィコンスタイル：

<div class="btn btn-primary glyphicon glyphicon-search">
    <asp:Button ID="Button1" runat="server" Text="Search" BackColor="Transparent" BorderWidth="0" OnClick="Button1_Click" />
                    </div>
1
abdol-hamid Hosseiny

このように、ボタンまたはasp：Buttonの代わりにlinkBut​​tonを使用できます。

<linkbutton runat="server"><a class="btn btn-info btn-md"> <span 
 class="glyphicon glyphicon-plus" style="font-size: x-large; font-weight: 
 bolder"></span> </a></linkbutton>
1
zafer