@ font-faceを使ってGoogle Webフォントを読み込むにはどうすればよいですか？

私はCormorant GaramondというGoogleフォントを使いたいですが、私が望むことをするために@ font-faceコマンドを得ることができません。@ font-faceを使ってGoogle Webフォントを読み込むにはどうすればよいですか？

/* latin-ext */ 
@font-face { 
    font-family: 'Cormorant Garamond'; 
    font-style: normal; 
    font-weight: 400; 
    src: local('Cormorant Garamond Regular'), local('CormorantGaramond-Regular'), url(https://fonts.gstatic.com/s/cormorantgaramond/v3/EI2hhCO6kSfLAy-Dpd8fd8lWqVXdZDPPgQrkuJ8lbib3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2'); 
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; 
}

これは単なる「体」宣言の前に、右上にある：このようになりますcssファイル私はthesという命令（https://coderwall.com/p/5vrdkg/google-fonts-using-fontface-in-your-css）に続いていると私は今、私の（複数の）のいずれかで宣言を持っていますそれは明らかにはArial表示され

.collection-editorial p { 
    font-family: 'Cormorant Garamond', Arial; 
    line-height: 110%; 
    text-align: left !important; 
}

私は（Chromeを使用して）ページをロードします。さらにダウンその後

私はこれを持っています。しかし、インスペクタを使用してコンソールにエラーは表示されず、「計算された」CSSルールを見ると、明らかにCormorant Garamond（CSSルールが正しく適用されているようです）が表示されるはずです。しかし、明らかにそれは正しく出てこない。私はいくつかのトリックを欠場する必要がありますが、何ですか？

出典

2017-03-04 Joel Guesclin

あなたはフォントファイル（複数可）を含んでいましたか？自分の '@ font-face'プロパティを定義する必要がないように、単にGoogleのCDNを使うのはなぜですか？ http://codepen.io/anon/pen/LWZjyy –

このフォントをWebページに埋め込むには、このコードをHTMLドキュメントの<head>にコピーします。

その後

<link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond" rel="stylesheet">

は、このファミリを指定するには、以下のCSSルールを使用します。

font-family: 'Cormorant Garamond', serif;

出典

2017-03-04 18:36:39

@ font-faceを使ってGoogle Webフォントを読み込むにはどうすればよいですか？

答えて

関連する問題