2013-08-23の勉強会でアイコムーン「シンボルフォント」についてやりました。

アイコンを画像ではなく文字情報として扱うので大きく表示した場合に画像だとギザギザになるのが、これだとギザギザになりません。

http://icomoon.io/だいたい無料

1. 上記のサイトにアクセス
2. menuのapp→start the app→アイコンがたくさん表示
3. 矢印ツールで好きなのを好きなだけ選択
4. フッターの「font→」クリックすると、Downloadとなるのでクリックしてダウンロードする。
5. あっ、そうだ！ダウンロードの前にPreferenceをクリックして選んだアイコンをまとめたファイルに任意の名前つける。チェックboxは特になにもチェックしなくていい。
6. ダウンロードすると任意の名前の後にアイコムーンがつけた数字のファイルができましたよね。例えばnobuyasu2041みたいなの。



7. 実際に使用するのは、style.cssとfontフォルダです。ie7以下にも対応させたい人は、Ite-ie7.jsも必要です。
8. index.htmlをテキストエディタで開いてみましょう。div class=”glyph”の中に
   <div class="fs1" aria-hidden="true" data-icon="&#xe000;"></div>

   1	<div class="fs1" aria-hidden="true" data-icon="&#xe000;"></div>

   が、ありますよね。
   それを使いたいHTMLにコピペすればつかえます。その際にHTMLとstyle.cssとfontフォルダのパスの位置に注意して下さい。パスの位置はindex.htmlを参照。あと、index.htmlをブラウザで開くとどんなアイコンが入っているか見る事ができます。

ie対策の人は、index.htmlのheadにある以下の文を自身のheadに貼りつけて！

icomoon使い方でググると色々出てきます。僕の説明だけじゃ????の人は、それらも参考にしてみて下さい。もちろんコメントしてくれれば、お答えします。

↓↓↓↓↓↓↓↓

かおりんごさんが別記事で書いてくれました。
http://clubringo.com/longshadow-icon/