CSSで外部フォントファイルを読み込む方法

CSS では、「@font-face」ルールを使用して外部フォント ファイルを読み込むことができます。構文 @font-face {font-family: フォント名; src: url (外部フォント ファイル パス); [font -weight: 太さの値];[font-style: スタイルの値];}".

このチュートリアルの動作環境: Windows7 システム、CSS3&&HTML5バージョン、Dell G3 コンピューター。

CSS では、「@font-face」ルールを使用して外部フォント テキストを読み込むことができます。

@font- face は、主にユーザー定義の Web フォントを Web ページに埋め込む CSS3 のモジュールです。

@font-face ルールを使用することにより、Web デザイナーはいかなる種類の「ネットワーク セキュリティ」も使用する必要がなくなります。 " Font.

@font-face ルールでは、まずフォント名 (myFirstFont など) を定義してから、フォント ファイルを指定する必要があります。

構文規則@font-face:

@font-face {
      font-family: 字体名称;
      src: <source> [<format>][,<source> [<format>]]*;
      [font-weight: <weight>];
      [font-style: <style>];
    }

• font-family: フォント名: カスタム フォント名 (通常は導入されたフォント名に設定されます)。後続のスタイル ルールで使用されるフォントを参照する名前

• src : フォントの読み込みパスと形式を設定します。複数の読み込みパスと形式はカンマで区切ります

  srouce : フォントの読み込みパス (絶対 URL または相対 URL にすることができます)

  format : フォントの形式は、主にブラウザの識別に使用され、一般に次のタイプがあります - truetype 、opentype、truetype-aat、embedded-opentype 、avg など

css で外部フォント ファイルを使用する方法

1. まず、 、フォントをダウンロードし、フォント ディレクトリ

2 に置きます。@font-face ルールを使用してフォントを導入し、適切な名前を付けます

@font-face {
 font-family: 'fontnameRegular';
 src: url('fontname.eot');
 src: local('fontname Regular'),
        local('fontname'),
        url('fontname.woff') format('woff'),
        url('fontname.ttf') format('truetype'),
        url('fontname.svg#fontname') format('svg');
}

3. 定義したばかりのフォントを使用します

h1{font-family: fontnameRegular}

(学習ビデオ共有: css ビデオ チュートリアル)

以上がCSSで外部フォントファイルを読み込む方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。