1

自分のサイトで @font-face を実行しようとしていますが、残念ながらうまくいきません。私は試した：

@font-face {
    font-family: BN Shirly; /*Adding a custom font*/
    src: url('Fonts/BN Shirly.ttf');  /*Source of font*/
}

そして、スパンでテキストを使用したい:

#categories span {
    color: white;
    font-family: 'BN Shirly';
    font-size: 30px; 
}

カスタム フォントが機能するようにするには、どうすればこれを修正できますか?

4

2 に答える 2

2 
@font-face {
   font-family: BN-Shirly; /*Adding a custom font*/
   src: url('Fonts/BN-Shirly.ttf');  /*Source of font*/
}


#categories span {
    color: white;
    font-family: BN-Shirly;
    font-size: 30px; 
}

フォント ファミリにスペースが表示されます。スペースを削除して試してみてください。宣言クラスの引用符を削除します。

アップデート

@font-face {
    font-family: 'BN-Shirly';
    src:    url('Fonts/BN-Shirly.ttf') format('truetype');
}
于 2012-11-11T19:36:19.903 に答える
0

まず、このサービスにアクセスしてフォントを変換します: http://www.font2web.com/

次に、次の CSS を実行します。

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

もちろん、フォント名を置き換えてください。

于 2012-11-11T19:36:47.537 に答える