私は@font-face
自分の会社のサイトで使用していますが、動作/見栄えがします。FirefoxとChromeを除いて、.woff
ファイルに404エラーがスローされます。IEはエラーをスローしません。私はルートにフォントを配置していますが、cssフォルダー内のフォントを試してみましたが、フォントのURL全体を指定することもできました。これらのフォントをcssファイルから削除すると、404が取得されないため、構文エラーではないことがわかります。
また、fontsquirrelsツールを使用して@font-face
フォントとコードを作成しました。
@font-face {
font-family: 'LaurenCBrownRegular';
src: url('/laurencb-webfont.eot');
src: local('☺'),
url('/laurencb-webfont.woff') format('woff'),
url('/laurencb-webfont.ttf') format('truetype'),
url('/laurencb-webfont.svg#webfontaaFhOfws') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'FontinSansRegular';
src: url('/fontin_sans_r_45b-webfont.eot');
src: local('☺'),
url('/fontin_sans_r_45b-webfont.woff') format('woff'),
url('/fontin_sans_r_45b-webfont.ttf') format('truetype'),
url('/fontin_sans_r_45b-webfont.svg#webfontKJHTwWCi') format('svg');
font-weight: normal;
font-style: normal;
}