@フォントフェース機能
生産現場では、いくつかのフォントの代わりに、デフォルトは、あなたが、する@ font-faceで独自特定のフォントをロードすることができ、特定のテキスト効果を達成することは避けられません。
@フォントフェースCSS文は、（設計者が簡単にフォント、ビューアがコンピュータにインストールされているかどうかを検討する必要はありませんを指定することができます）は、Webフォントの多様性を実現するために使用される機能ブロックです。主に組み込みWebフォントに我々はWeb開発にフォントを使用し、@フォントフェースモジュールの出現で、あなたのページに定義を所有し、唯一のWebセーフフォントを使用することを恐れていないフォントの顔は、彼が何であるかを言うことはできません@新しいもの、CSS2.0仕様ではこのようなものがあり、IE4.0の始まりがあったが、特に広く使用されなかった、と後でCSS2.1でドラフトで削除されたています。ウェブの急速な発展に伴い、@フォントフェース値より多くの著名な、と再びドラフトCSS3に組み込まれました。フォントがシステムビューアにインストールされていないため、解決するために、@フォントフェースルールが原因の問題を表示することはできません。
@フォントフェースの使用
1.速記フォントファイル名
@フォントフェース { フォントファミリ：「YT」 ; SRC：URL（ 'YourWebFontName.eot'）、ローカル（ 'YourFontName.eot'） ; }
あなたはYTフォントを使用する必要がどこに、あなたは直接フォントファミリを使用することができます：YTを。
ヒント：
a.src属性をダウンロードは、URLがURL（このような使用は、サーバー上のフォントダウンロードなど）を示し、ローカルはローカルアドレスを表し、フォントを定義する
コードのセクションとして複数のフォントがSRCで定義されている場合はBを、彼らはまた、ある候補の関係を、。
あなたが定義されたフォントや順序SRCを変更する場合は、C。、変更リフレッシュの効果が見えない見てオープンし、ブラウザを閉じてくださいとなります。
2.フォントサーバ
@フォントフェースブラウザの互換性
それぞれ異なるブラウザの互換性する@ font-face、および異なるブラウザがそのする@ font-faceを意味し、フォントの異なるフォーマットをサポートしているので、私たちも、二つのフォーマットフォント.eot、少なくとも.woffが必要.SVGフォントなども、より多くのサポートブラウザのバージョンを達成する必要があります。.TTFまたは.OTFは、Firefox 3.5、Safariの、オペラに適した、.EOTは、Internet Explorer 4.0の+に適用されます。SVG、クロム、IPhoneには適用され、次の3つのファイル形式を使用するフォントを取得し、主要なブラウザでのことを確認これは、通常のフォントで表示することができます。
する@ font-faceのCSS3プロパティは、Webページに埋め込まれた任意のフォントで達成することができますが、IEは、Microsoft独自のEOTフォント形式をサポートし、他のブラウザでは、このフォントフォーマットをサポートしていませんが、他のブラウザは、TTF（TrueTypeフォント）を設定することができます使用カスタムフォントなどとOTF（OpenTypeの）2つのフォント
以下は、解決すべき3つのフォントファイル形式の一部を取得する方法です。一般的に、我々は（またはサイトのデザインリソースで発見されている）一方で、特定のフォントフォーマットを持っている、最も一般的なのは.TTFファイルであり、我々はこのファイル形式を通じて、残りの2つのファイル形式を変換する必要があります。ウェブサイトFontsQuirrel（経由フォントファイルフォーマット変換http://www.fontsquirrel.com/tools/webfont-generator提供onlinefontconverter取得）、またはオンラインのフォント変換サービス。フォントファイルの3つのフォーマットを取得した後、次のステップは、スタイルシートでフォントを宣言し、必要な場合にフォントを使用することです。
@フォントフェース { フォントファミリ：「YourWebFontName」 ; SRC：URL（ 'YourWebFontName.eot'） ; / * IE9のcompatモード* / SRC：URL（ '？YourWebFontName.eot #iefix'）フォーマット（ '組み込みのOpenType'）、/ * IE6-IE8 * / URL（ 'YourWebFontName.woff'）フォーマット（ 'WOFF'） 、/ * 最近のブラウザ* / URL（ 'YourWebFontName.ttf'）フォーマット（ 'TrueTypeの'）、/ * サファリ、アンドロイド、iOSの* / URL（ 'YourWebFontName.svg＃YourWebFontName'）フォーマット（ 'SVG'） ;