私は鉛筆や家のアイコンのようないくつかのシンボルにCSSでWingdingsフォントを使用していました。
IE、ChromeおよびSafariで動作しましたが、FirefoxおよびOperaでは動作しませんでした。Googleで検索しましたが、より良い解決策は見つかりませんでした。
Firefoxで動作しないのはなぜですか?これらのアイコンを使用する必要がありますが、FirefoxでWingdingsを使用する方法はありますか?
MozillaおよびOperaは標準に準拠しています。Wingdingsは標準ではありません(Microsoftからの驚きです)。Unicodeにマッピングされていないため、Webサイトで使用しないでください。
ただし、絶望しないでください。ほとんどのシンボルはUnicodeで使用できます。チェック http://www.alanwood.net/demos/wingdings.html
重要な補遺(2014年10月):nicode v7 の時点で、2014年6月16日リリース、WebdingsおよびWingdingsのすべてのキャラクターUnicodeに追加されました。以下のコメントを参照してください。
Wingdings文字canは、「プライベート使用領域」(コードポイントU+E000
からU+F7FF
)を介して、Unicode準拠の方法でアクセスできます。これらの文字コードは、通常のUnicode文字セットの一部ではないフォント固有の記号用に予約されており、実際、Wingdingdsはすべての記号をサブ範囲U+F021
からU+F0FF
にマップします。
たとえば、従来のエンコーディングでP
= 0x50
にマップされる三角フラグには、U+F050
=
= 
(HTML )= \F050
(CSS)。
他のブラウザについてはわかりませんが、Firefox 12では動作します。
ウェブサイトを引用するには:
Mozillaはデフォルトの設定でシンボルフォントをサポートするべきであると人々の間で絶え間ない議論がありました。これまでのところ、妨害者が勝っています。
@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>
Gimpまたはその他のグラフィックソフトウェアを使用して、Wingdingsフォントから必要なアイコンのGIFを作成できます。