KUBOGENKUBOGENデザインプログラミングマーケティングWordPressプログラミングWebフォントを指定する@font-faceの書き方【CSS】@font-faceはCSS3から導入された仕様で、Webフォントの利用を指定することができます。Webフォントはサーバー上に置いてあるフォントデータを使って、ホームページ上に表示させるシステムやフォントのこと。Font」のようなWebフォントのサービスを使うという方法もありますが、ここでは@font-faceで指定する方法を確認します。基本的には以下のように書き、フォントを使用したい箇所に指定するだけで、Webフォントを利用することができます。オプション;}フォント名フォント名には任意のフォント名を指定します。フォントを適用したい箇所に、font-familyやfontプロパティを使い、指定した値と同じ値を書くことで、@font-faceで指定した値(Webフォント)が表示されます。フォントURLとフォント形式url()という形で、WebフォントのファイルがあるURLを指定します。フォントURLに続けて半角スペースで区切り、フォント形式を記述します。これは、ブラウザによって対応しているフォントファイルの形式が異なるためです。フォントURLとフォント形式のセットはカンマ(,)で区切って、複数指定することも可能です。Explorer8以前で必要な形式です。オプションオプションとして、以下のプロパティや値を指定することができます。font-styleフォントのスタイルを指定font-weightフォントの太さを指定font-stretchフォントの幅を指定font-variantフォントのスモールキャップを指定font-feature-settingsOpenTypeフォントの使用を指定unicode-rangeWebフォントの適用範囲を指定unicode-rangeはCSSプロパティではないんですが、同じように指定することができます。このように比較的簡単にWebフォントを利用することができます。書き方に関しては、『Webフォントを指定する@font-faceの書き方【CSS】』で、フォントファイルの形式の種類についても説明しています。*Website次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。KUBOGENサイトマップ。