ルールCSS3する@ font-face
例
そのURLを見つけるために、「myFirstFont」という名前のフォントを指定して、場所を指定：
@フォントの顔
{
フォントファミリ：myFirstFont。
SRC：URL（ 'Sansation_Light.ttf'）、
URL（ 'Sansation_Light.eot'）; / * IE9 * /
}
{
フォントファミリ：myFirstFont。
SRC：URL（ 'Sansation_Light.ttf'）、
URL（ 'Sansation_Light.eot'）; / * IE9 * /
}
»をお試しください
ブラウザのサポート
フォント-face規則@のInternet Explorer 9、Firefoxの、オペラ、クロム、およびSafariのサポート。
ただし、Internet Explorer 9は、フォントだけは、Firefox、Chromeの、サファリ、オペラサポートの.ttfの種類.eotとフォントの2種類.OTFサポートしています。
注：IEのInternet Explorer 8の以前のバージョンがする@ font-face規則をサポートしていません。
属性の定義と指示
@フォント-face規則は、Webデザイナーは、もはや「Webセーフ」のフォントいずれかを使用する必要がありません。
フォント、フォントの名前 - 顔ルール：
- フォントファミリ：myFirstFont。
どこかのサーバーに含まれているフォントファイル、参照CSS：
- SRC：URL（ 'Sansation_Light.ttf'）
フォントファイルが別の場所にある場合は、完全なURLを使用します。
- SRC：URL（ '../../ www.w3cschool.css / CSS3 / Sansation_Light.ttf'）
今フォントを使用する準備ができて、次のことがすべてのdiv要素にそれを使用する方法の例は次のとおりです。
div要素
{
フォントファミリ：myFirstFont。
}
{
フォントファミリ：myFirstFont。
}
構文：
- @フォントの顔
{
フォントプロパティ
}
divの中で使用されるフォントの例を以下に示します。
div要素
{
フォントファミリ：myFirstFont。
}
{
フォントファミリ：myFirstFont。
}
文法
@フォントの顔
{
フォントプロパティ
}
{
フォントプロパティ
}
| フォント記述 | 値 | 説明 |
|---|---|---|
| フォントファミリ | 名前 | 必須。 フォント名を定義します。 |
| SRC | URL | 必須。 フォントのダウンロードURLを定義します（S） |
| フォントストレッチ | ノーマル 凝縮されました 超凝縮 余分な凝縮 半凝縮 拡張しました 半拡大 超拡大 超拡大 | オプション。 フォントを延伸する方法を定義します。 デフォルト値は「正常」であります |
| フォントスタイル | ノーマル イタリック 斜めの | オプション。 ようにする必要がありフォントスタイルを定義します。 デフォルト値は「正常」であります |
| フォントの太さ | ノーマル 大胆な 100 200 300 400 500 600 700 800 900 | オプション。 カスタムフォントの太さ。 デフォルト値は「正常」であります |
| Unicodeの範囲 | Unicodeの範囲 | オプション。 範囲はフォントがUnicode文字をサポートし定義されています。 デフォルト値は「U + 0-10 FFFF」であります |
関連記事
CSS3のチュートリアル： CSS3フォント