Google Web フォントを CSS ファイルにインポートするにはどうすればよいですか?

CSS ファイルでの Google Web フォントのインポート

ドキュメント ヘッドへのアクセスが制限されているコンテンツ管理システム (CMS) を使用する場合、インポートGoogle Web Fonts を CSS ファイルに直接取り込むことが必要になります。これを実現する方法は次のとおりです。

@import メソッドの使用

@import メソッドを使用すると、外部 CSS ファイルを CSS ファイルにインポートできます。 Google Web フォントをインポートするには、次の構文を使用します。

@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');

「Open Sans」を希望のフォントの名前に置き換えます。フォント名に複数の単語が含まれる場合は、各単語の間に " " 記号を追加して URL エンコードします。

@import ディレクティブを配置する

@import がディレクティブは、CSS ファイルの最上部、スタイル ルールの前に配置されます。

Google Fonts API

Google Fonts は、フォントの @import ディレクティブを生成する簡単な方法を提供します。希望のフォントを選択し、( ) アイコンをクリックして、「1 Family Selected」コンテナを展開します。

「カスタマイズ」タブで、希望のオプションを選択します。 「埋め込み」タブの「フォントの埋め込み」の下にある「@import」をクリックします。

その他の考慮事項

インポートするフォントが複数ある場合は、それらを単一の @import ディレクティブに結合してパフォーマンスを向上させます。

特定のフォントを使用する前に必ず Google のフォント使用許諾契約を確認し、準拠していることを確認してください。

以上がGoogle Web フォントを CSS ファイルにインポートするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。