1

ここでイライラするのはここです。Sansation 用のフォント パックを入手し、@font-face で使用してみました。通常のバージョンは機能しますが、「ボールド」バージョンは機能しません。ファイル名を確認しましたが、間違いなく正しいです。私の理解では、どのフォントでも機能するはずです。何か不足していますか？

@font-face
    {
        font-family: sansation_regular;
        src: url('/fonts/sansation_regular-webfont.ttf'),
            url('/fonts/sansation_regular-webfont.eot');
    }

次に、テキスト要素に対応する CSS の font-family を変更せずに、次のように変更します。

@font-face
    {
        font-family: sansation_regular;
        src: url('/fonts/sansation_bold-webfont.ttf'),
            url('/fonts/sansation_bold-webfont.eot');
    }

ご協力ありがとうございます。

4

4 に答える 4

1

おそらく、FontSquirel を介してフォントを実行して、完全なセット http://www.fontsquirrel.com/tools/webfont-generatorを取得する必要もあります。

生成される css は次のようになります。

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

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

また、完全なULR参照の使用は避けたいと思います.cssファイルからフォントフォルダーへのパスが正しいことを確認してください

于 2013-04-18T09:06:17.940 に答える
0

ローカル ファイル ディレクトリを使用してもうまくいかない場合は、絶対パスを試してください。次の解決策が機能しました。

@font-face
    {
        font-family: sansation_regular;
        src: url('http://www.siteAddress.com/fonts/sansation_bold-webfont.ttf'),
            url('http://www.siteAddress.com/fonts/sansation_bold-webfont.eot');
    }
于 2013-04-18T05:52:27.303 に答える
0

@DOLOisSOLO と @Mr. Lavalamp が提案した、絶対パスが機能するはずです。

今後の参考のために、CSS ファイルはフォルダー内にありますか? その場合は、相対パス URL を使用できます。次に例を示します。

@font-face
{
    font-family: sansation_regular;
    src: url('../fonts/sansation_regular-webfont.ttf'),
        url('../fonts/sansation_regular-webfont.eot');
}

毎回 1 レベル上がることを表すドット。

于 2013-04-18T09:01:06.257 に答える