web-dev-qa-db-ja.com

WingdingsフォントファミリはFirefoxで動作しないようで、Opera

私は鉛筆や家のアイコンのようないくつかのシンボルにCSSでWingdingsフォントを使用していました。

IE、ChromeおよびSafariで動作しましたが、FirefoxおよびOperaでは動作しませんでした。Googleで検索しましたが、より良い解決策は見つかりませんでした。

Firefoxで動作しないのはなぜですか?これらのアイコンを使用する必要がありますが、FirefoxでWingdingsを使用する方法はありますか?

34
niko

MozillaおよびOperaは標準に準拠しています。Wingdingsは標準ではありません(Microsoftからの驚きです)。Unicodeにマッピングされていないため、Webサイトで使用しないでください。

ただし、絶望しないでください。ほとんどのシンボルはUnicodeで使用できます。チェック http://www.alanwood.net/demos/wingdings.html

重要な補遺(2014年10月):nicode v7 の時点で、2014年6月16日リリース、WebdingsおよびWingdingsのすべてのキャラクターUnicodeに追加されました。以下のコメントを参照してください。

41
mddw

次のようなユニコード文字を使用できます

http://www.fileformat.info/info/unicode/char/270e/index.htm

14
Joseph Marikle

Wingdings文字canは、「プライベート使用領域」(コードポイントU+E000からU+F7FF)を介して、Unicode準拠の方法でアクセスできます。これらの文字コードは、通常のUnicode文字セットの一部ではないフォント固有の記号用に予約されており、実際、Wingdingdsはすべての記号をサブ範囲U+F021からU+F0FFにマップします。

たとえば、従来のエンコーディングでP = 0x50にマップされる三角フラグには、U+F050 = = (HTML )= \F050(CSS)。

他のブラウザについてはわかりませんが、Firefox 12では動作します。

5
Christoph Lipka

ウェブサイトを引用するには:

Mozillaはデフォルトの設定でシンボルフォントをサポートするべきであると人々の間で絶え間ない議論がありました。これまでのところ、妨害者が勝っています。

http://hutchinson.belmont.ma.us/tth/Wfonts.html

2
orangething
@font-face {
  font-family: "Your typeface";
  src: url("type/filename.eot");
  src: local("☺"),
    url("type/filename.woff") format("woff"),
    url("type/filename.otf") format("opentype"),
    url("type/filename.svg#filename") format("svg");
  }

詳細はこちら http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/

hTMLのシンプルなソリューション

<style type="text/css">
@font-face {
    font-family: "Ace Crikey";
    src: url(ace.ttf);
}
.ace {
    font-family: "Ace Crikey";
    font-size: 230%;
}
</style>
0
Grumpy

Gimpまたはその他のグラフィックソフトウェアを使用して、Wingdingsフォントから必要なアイコンのGIFを作成できます。

0
Eddy Freddy