web-dev-qa-db-ja.com

CSS @ font-face-"src：local（ '☺'）"はどういう意味ですか？

@font-faceを初めて使用し、fontsquirrelからフォントキットをダウンロードしました

CSSに挿入することをお勧めするコードは次のとおりです。

@font-face {
    font-family: 'junctionregularRegular';
    src: url('Junction-webfont.eot');
    src: local('☺'), 
        url('Junction-webfont.woff') format('woff'), 
        url('Junction-webfont.ttf') format('truetype'), 
        url('Junction-webfont.svg#webfontoNEpZXy2') format('svg');
}

今、スマイリーフェイスの事は私が困惑しています。しかし、srcのurlの数も同じです。なぜ多くのファイルを推奨するのでしょうか。また、ページがレンダリングされるときにすべてがブラウザに送信されるのでしょうか？ .ttf以外のすべてを削除しても問題はありませんか？

cssfont-face
128
stephenmurdoch

font-squirrelのfont-face generatorでメモを読むと、それはpaul irishによる落とし穴であることがわかります。

これが彼の ブログ投稿 からの抜粋です：

そして.. @font-face構文について

元の防弾構文よりも防弾スマイリーのバリエーションをお勧めします。

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('☺'),
       url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

防弾ポストから：

はい、それはにこやかな顔です。 OpenType仕様では、2バイトのUnicode文字はMacのフォント名ではまったく機能しないため、誰かがそのような名前のフォントを実際にリリースする可能性が低くなっています。

スマイリーが優れたソリューションである理由はいくつかあります。

  • Webkit + Font Managementソフトウェアは、グリフをAブロックに変換するなど、ローカル参照を台無しにする可能性があります。

  • OS Xでは、フォント管理ソフトウェアは、ライブラリ/フォントの外部からアクセス可能なlocal（）フォントにアクセスしようとすると、ダイアログを表示するようにシステム設定を変更する場合があります。防弾ポストの詳細。 Font Explorer Xは、Firefoxの他の機能を台無しにすることでも知られています。

  • 可能性は低いですが、考えているものとは完全に異なるlocal（）フォントを参照できます。 （異なるフォント、同じ名前でのTypophileの投稿）少なくともそのリスクはありますが、タイプの制御をブラウザとホストマシンの両方に委ねています。このリスクは、フォントのダウンロードを回避するメリットに値しない場合があります。

これらはすべてEdgeのかなりのケースの問題ですが、検討する価値があります。

89
corroded

Local（☺︎）は、使用できないフォントのダウンロードからIE6-8をそらすCSSハックです（EOT形式のフォントのみ使用できます）。

説明：最後のsrcプロパティがCSSカスケードで優先されます。つまり、CSSは下から上に解析されます。 local（☺︎）は、使用できないフォントをダウンロードする帯域幅を無駄にせずに、IEを一番下のsrcをスキップさせ、.eot形式（あなたの質問の上の行）それが使用します。スマイリーは、その名前のローカルフォント（文字の組み合わせ）が存在しないようにするためのものです。

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

32
Magne