広告

posted by fanblog

2017年08月19日

Font Awesomeでアイコン表示



Font Awesomeを使用しています。
アイコンをフォントで表示できます。








指定方法
CSSファイル

<link href=" https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css " rel="stylesheet integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">



HTML
 アイコンを表示する位置に <i class="fa fa-home"></i>
 拡大・青色 <i class="fa fa-home fa-5x" style="color:blue";></></i>
 90度回転  <i class="fa fa-home fa-3x fa-rotate-90"></i>
 常時回転  <i class="fa fa-home fa-spin"></i>

その他のアイコン
 <i class="fa fa-motorcycle"></i>
 <i class="fa fa-bicycle"></i>
 <i class="fa fa-automobile"></i>
 <i class="fa fa-ship"></i>
 <i class="fa fa-subway"></i>
 <i class="fa fa-database"></i>

お客さんの会社のHPで使用されていたので、Font Awesome について知りました。
おもしろそうです。


summer_baner.gif



タグ: Font Awesome
【このカテゴリーの最新記事】

posted by db-engineer at 00:00 | Comment(0) | 小技

この記事へのコメント
コメントを書く

お名前:

メールアドレス:


ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

Build a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: