0

Web ページに独自のフォントを追加しようとしてきましたが、Font Squirrel コンバーターの正確な使用方法がまだわかりません。無料の .ttf フォントをダウンロードし、ジェネレーターで次のように変換しました。

@font-face 
{
font-family: 'AbiteRegular';
src: url('fonts/abite-webfont.eot');
src: url('fonts/abite-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/abite-webfont.woff') format('woff'),
     url('fonts/abite-webfont.ttf') format('truetype'),
     url('fonts/abite-webfont.svg#AbiteRegular') format('svg');
font-weight: normal;
font-style: normal;
}

fontsは、.ttf ファイルを変換しておくフォルダーです。そして、私はそれを次のように使用します：

body 
{
font-family: 'AbiteRegular';
}

この構成はすべて .css ファイルにあります。しかし、本文はこれを無視しています。なぜそれが起こっているのか知っていますか？

4

2 に答える 2

1

他のブラウザで確認しましたか？IE、Firefox、Chrome で確認してください。1 つのブラウザーでもフォントが表示されない場合は、フォルダー構造が間違っている可能性があります。

このようなフォルダ構成になっていますか? @font-face宣言を含むcssファイル（たとえば、font.css）は、その隣に名前の付いたフォルダーがfontsあり、フォントファイルがそのフォルダー内にあるように配置する必要があります。

/font.css
/fonts/abite-webfont.eot
/fonts/abite-webfont.woff
/fonts/abite-webfont.ttf
/fonts/abite-webfont.svg

これは、IE 6、IE 7、および IE 8 を含むすべてのブラウザーで機能するはずです。パスが正しいことを確認してください。また、body宣言は宣言の後に来る必要があります。font.cssつまり、font.cssスタイルの前に を含める必要があります。

お役に立てれば！:)

于 2012-06-07T10:21:45.060 に答える
1

フォントに問題がある可能性がありますURL 

url('fonts/abite-webfont.eot');...

または、使用しているブラウザがダイナミック フォントをサポートしていません。

于 2012-06-07T10:15:16.947 に答える