プログラムを中心とした個人的なメモ用のブログです。 タイトルは迷走中。
内容の保証はできませんのであしからずご了承ください。

2020/04/20

submit ボタンにアイコンを表示する

event_note2020/04/20 1:31

フォーム送信する際にクリックする submit ボタンにアイコンを表示する方法です。
ここでは例として Font Awesome のアイコンを表示させてみます。

submit ボタンにアイコンを表示させるためには input 要素の value にアイコンのコードを Unicode でセットします。

アイコンのコードは Font Awesome のサイトで確認できます。

コードをセットするときは、最初に &#x を、最後に ; を追加します。
例えば、Save アイコンのコード f0c7 を指定する場合は以下のようになります。

<input type="submit" value="&#xf0c7; 保存" class="fas">

class には使用するアイコンのスタイルに応じて適切なものを設定します。