html - フォーム送信ボタンでグリチコンを使用することは可能ですか?

Question

グリフィコンを含むボタンを作成するのに問題はありませんが、常に<a class="btn...". これは機能しません: <input type="submit" class="btn btn-default" value="" />. 空白のボタンを生成するだけです。

これを行う方法はありますか？

score 1 · Accepted Answer

過去に<input>マークアップの使用に問題がありました。多分あなたはそれで試すことができます<button>。

これがbootsrap docで行われたことです：

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-star"></span> Star
</button>

必要に応じて、グリフィコンに関するブートストラップドキュメントを参照してください。

お役に立てば幸いです:p

score 0 · Accepted Answer

グリフィコンは「後」または「前」の疑似要素を使用しますが、これは非コンテナタグや、入力などの自己終了タグではサポートされていません。したがって、入力送信を使用したい場合 (そして、はい、あなたのことを理解しています。私は以前に行ったことがあります)、次のように再作成します。

<span class="glyph class here"><input type="submit" value="whatever" /></span>

編集、スパンには微調整が必要です。ボタンのように見せてから、内部の送信ボタンをもう少し微調整する必要があります。

input[type="submit"] {
        display: inline-block;
        background-color: transparent;
        border: 0;
        cursor: pointer;
    }

3 に答える 3