1

font squirrels font-face generator を使用し、すべてのフォントとスタイルシートをプロジェクト フォルダー内の _webfonts というフォルダーに配置しました。

@font-face {
    font-family: 'homesteadreg';
    src: url('homestead-regular-webfont.eot'); 
    src: url('homestead-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('homestead-regular-webfont.woff') format('woff'),
        url('homestead-regular-webfont.ttf') format('truetype'),
        url('homestead-regular-webfont.svg') format('svg');

}

私のメインCSSでは、次のコードを使用してCSSをインポートしました

@import url("_webfonts/homesteadreg/stylesheet.css");

また、 body タグのルールも定義しました

body {
    font-family: Helvetica, Arial, sans-serif;}

h1タグのルール

    h1 {
    font-size: 68px;
    color: #c8c8c8;
    line-height: 58px;
    font-family: homesteadreg, Helvetica, Arial;
    text-align: center;
}

私のヘッダーには、index.html にリンクされているロゴがあります。

<div id="header"><a href="index.html" target="_self"><img src="bilder/logo4.png" border=0 alt="alternativer text" width="192" height="40" /></a></div>

Firefoxでは、すべてが正常にレンダリングされます

Internetexplorer 9 には奇妙なバグがあります。最初の読み込みではすべて問題ないように見えますが、ロゴをクリックして index.html にリダイレクトすると、ページ全体がカスタム フォント (h1 タグだけでなく) でレンダリングされます。ロゴをもう一度クリックすると、すべてが再び正常にレンダリングされ、ロゴを再度クリックしてもそのままになります。キャッシングに問題があるようです。

誰でも助けてくれることを願っています！

事前にどうもありがとうございました

4

1 に答える 1

1

@importフォントを含めるには、メインの css を使用する必要があるかもしれません。この方法はパフォーマンスがかなり悪いです。

代わりに、ドキュメントの先頭から font-face css へのリンクを試みましたか?

于 2012-09-24T07:23:44.267 に答える