インクルードを使用してGoogleフォントコードを取り込みます。彼らの CSS は次のようになります。
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 300;
src: url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDfY6323mHUZFJMgTvxaG2iE.eot);
src: local('Oswald Light'), local('Oswald-Light'), url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDfY6323mHUZFJMgTvxaG2iE.eot) format('embedded-opentype'), url(http://themes.googleusercontent.com/static/fonts/oswald/v7/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
これを使用してcssクラスを作成しました
.oswald {
font-family: 'Oswald', Verdana, Arial, Helvetica, sans-serif
}
それから私はそれをこのように使います
<div class="oswald">text</div>
ここで、少し奇妙になります。私は Visual Studio を使用しているので、ローカルでデバッグすると正しいフォントが表示されます。サーバーに置くと、Verdana フォントが表示されます。クロムも間違った正面を示しています。Safari と Firefox はどちらも正しいフォントを表示します。