web-dev-qa-db-ja.com

カスタムフォントからUnicodeアイコン値を取得します

サイトを使用してアイコンフォントビルドのCSSを作成する必要があります flaticon 。 10.10のMACを使用して開発しましたが、CSS内に挿入する必要のある1文字のUnicode値を取得する方法が見つかりません。

.font-icon-pencil:before {
    content: "\e038";
}

フォントファイルの内容を読み取って、そのカスタムメイドのフォント内のアイコンコードを取得するにはどうすればよいですか？

cssmacosfontsiconsglyphicons
7
al404IT

MacOS Sierraでは、 Font Book （デフォルトのアプリ）でアイコンのUnicode値を取得できます。

  1. フォントをインストールします。
  2. FontBookでユーザーがインストールしたフォントを開きます。
  3. 目的のアイコンにマウスを移動します。ホバーすると、Unicode値というタイトルが表示されます。

Font Book

16
Micer

編集された回答（2015年4月29日）

@ al404itコメント： "CSSパーツの書き方は知っています。カスタマイズされたフォントから、コンテンツで使用する対応するコードを取得する方法がわかりません：" xxxxx ";"

回答

オプション1）
フォントビューア 、ORs類似のフォントビューアsoftware
これが最も簡単なオプションです。

  1. FontViewerソフトウェア をインストールします
  2. 文字コード表からフォントのアイコンコードを取得します
  3. Rishida Unicode Code Converter などのオンラインコードコンバーターを使用して、エスケープされたCSSコードを取得します

これがうまくいかない場合...

オプション2）
使用 icomoonアプリ

  1. サインアップして新しいプロジェクトを作成する
  2. そのプロジェクトで、フォントファイルをインポートします（「+アイコンのインポート」と呼ばれる左上のボタン） enter image description here
  3. フォント（右下のオプション）の下に、すべてのアイコンとそれぞれのコードのリストが表示されます。

これは確かに機能するはずです。

元の回答

@font-face {
    font-family: icons;
    src: url(MyFont.ttf); /* Replace with thatever your font file is */
}
.font-icon-pencil:before {
    font-family: icons, sans-serif;;
    content: "\e038";
}
8
Omar

https://fontdrop.info ：すべてのUnicodeCoedを一度に見ることができる非常に便利なWebサイト

2
devcline

この質問はかなり古いですが、私はあなたがその時に必要とした記事を持っていると思います：

https://css-tricks.com/snippets/css/using-font-face/

幸運を ：）

0
Mari Luna