0

@font-face の使用に少し問題があり、本当に混乱しています。私は自分が正しいことをしているかどうかだと思います。

だから私は宣言をした

@font-face{
    font-family: Art Post black; 
    src: url('/fonts/ArtPostblack.ttf');
    }
@font-face{
    font-family: SimplyDelicious; 
    src: url('/fonts/SimplyDeliciousFont3.ttf');
    }

その後、電話をかけました

#blah{font-family:Art Post black; } #blah2{font-family:SimplyDelicious;}

今問題は Art Post 黒は動作しますが、SimplyDelicious は動作しません また、Art Post 黒フォントを削除すると。カスタムフォントがまだ削除されていないことを意味します。それで... 混乱しています、私は正しくやっていますか? まあ、そうではないと思います。

4

2 に答える 2

2

あなたの構文は正しいですが、それは非常に基本的です。まず、次の推奨される @font-face 構文を使用します。

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), 
         url('myfont-webfont.woff') format('woff'), 
         url('myfont-webfont.ttf')  format('truetype'),
         url('myfont-webfont.svg#svgFontName') format('svg');
}

更新: フォント名にスペースが含まれている場合は、@font-face 構文と CSS 選択の両方で、フォント名の前後に "" が必要です。コードが示すように、一重引用符または二重引用符がない場合、正しく選択されません。それはおそらくあなたの問題です。ただし、この新しい防弾構文を使用して、よりクロスブラウザーにすることもできます。

ソース: http://www.fontspring.com/blog/the-new-bulletproof-font-face-syntax

次に、リンクが正しいことを確認します。URL の先頭に / を使用すると、ブラウザがドメインのルート ディレクトリに移動することに注意してください。ドメイン名の後にそれをアドレスバーに貼り付けて、フォントファイルがダウンロードされるかどうかを確認してください。そうであれば、リンクは正しいです。

于 2012-04-22T03:59:24.447 に答える
0

別のフォントを呼び出すこの方法が役立つ場合があります。

@font-face {
    font-family: 'myriadproregular';
    src: local('myriadproregular'), url('myriadproregular.ttf') format("truetype");
}
@font-face {
    font-family: 'myriadprocond';
    src: local('myriadprocond'), url('myriadprocond.ttf') format("truetype");
}
@font-face {
    font-family: 'myriadprosemibold';
    src: local('myriadprosemibold'), url('myriadprosemibold.ttf') format("truetype");
}

and in your case 



@font-face{
    font-family: Art Post black; (why this font name have space? it was supposed to be like ArtPostblack )

    src: url('/fonts/ArtPostblack.ttf');
    }
@font-face{
    font-family: SimplyDelicious; 
    src: url('/fonts/SimplyDeliciousFont3.ttf');
    }

それらがcssファイルと適切なパスの近くにあることを確認してください。

于 2012-04-22T05:52:31.807 に答える