自分用のWebフォントでアイコンを作る - 結城浩のブログ背景 自分のWebサイトでアイコンを使っている。 問題 pngなどの画像ファイルとしてアイコンを利用すると、大きさ調整や文字とのバランスで扱いが面倒である。 解法 Webフォントとしてアイコンを作り、CSSを用意しておく。 結果 シンプルなマークアップだけで任意の大きさのアイコンが利用できる。 HTML sample.html1 2 <link rel="stylesheet" href="http://www.hyuki.com/common/hyuki-font/hyuki-font.css" > <h1> <i class="hyuki-ghost"></i> 結城浩 </h1> 表示 結城浩 詳細 OmniGraffleのようなドローソフトで、アイコンをSVG形式で書き出す。複数アイコンは複数ファイルにしておく。 アイコンのSVGファイルをすべてzipにまとめて、Iconvault
