Font Awesomeのアイコン（WEBフォント）をフォームのボタンに使用する方法

2017/05/29 2017/05/31

WEBアイコンフォントで有名な「font-awesome」のアイコンを、をフォームのボタンに使用する方法を備忘録としてポストします。

CSS と UNICODE (ユニコード)を使う

<input type="button" value="&#xf0a8; 前画面に戻る" class="sample-back-btn" name="back">

1	<input type="button" value=" 前画面に戻る" class="sample-back-btn" name="back">

.sample-back-btn {
    font-family: FontAwesome;
}

.sample-back-btn {

font-family: FontAwesome;

}

ボタンの value に「」の様なコードを記述する事でアイコンを表示するのですが、これは使いたいアイコンフォントの詳細画面に書かれている UNICODE (ユニコード)です。

&# に続けて x、そして指定のコードを記述という形となります。

↑ ここに載っています。

なお、コードの一覧はこちらのページから確認することが可能です。

: amazonで購入した商品を返品する方法

amazonで間違った商品を購入してしまったので、今回の返品方法をメモ。
toogieの個人情報だらけなので至る所モザイクかかってますがご容赦を。

: 【カメラ】Flickr のアカウントの作成方法

デジカメで撮影した画像をGoogleドライブへアップロードしていましたら、無料で使える15ギカの80％を埋めてしまうという事態に唖然とし、他にストレージサービスはないものかと調査しましたら、Flickr（フリッカー）は無料で1テラまでアップロードできるというではありませんか。いざ使ってみようとしましたらアカウントの作成が結構面倒。日本語に対応していないサービスなので、英語が苦手な人にはちょっと敷居が高いかな、と感じたので、作り方を紹介したいと思います。

: 【HTML】a要素（aタグ）で電話発信用リンクを設定する方法

a要素の href 属性に電話番号を設定するだけでスマートフォンで電話発信用のリンクを作成することが可能です。その方法を備忘録としてポストします。

: 【CSS】スクロールしても画像を固定表示させる方法

画像を任意の場所に固定配置し、スクロールしてもその場に表示させる方法２種類を備忘録としてポストします。

: 【DRF】venv仮想環境を用いて、DRFシステムで書籍管理システムを作成する（4）Vue.jsの導入

第３回目でAPIを動作させることができましたので、次の手順はフロントで使用する「Vue.js」の導入です。