0

このサイトでは、@font-face を使用して Myriad Pro を上部のナビゲーション バーに表示しています。これはライセンス違反だと思います。すぐに代替バージョンを探します。キューフォンを見てみようかな？最初に @font-face ルールを機能させてから、別のフォントをドロップしたいと思います。

サイトには CSS があります。

<!--[if IE]>
@font-face {
    font-family: 'MyriadPro-BoldCond';
        src: url('.../myriadpro-boldcond.eot');
}
<![endif]-->

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

ただし、フォントは Chrome でのみ表示され、IE9、Opera、Firefox では表示されません。

更新: IE 条件付きエントリを他のエントリの下に移動しましたが、問題は IE に残ります:

@font-face {
    font-family: 'MyriadPro-BoldCond';
        src: url('http:/.../myriadpro-boldcond.eot?#iefix') format('embedded-opentype'),
               url('.../myriadpro-boldcond.woff') format('woff'),
               url('.../myriadpro-boldcond.ttf') format('truetype'),
               url('...myriadpro-boldcond.svg#myriadpro-boldcond') format('svg');
        font-weight: normal;
        font-style: normal;
}

<!--[if IE]>
@font-face {
    font-family: 'MyriadPro-BoldCond';
        src: url('...myriadpro-boldcond.eot');
}
<![endif]-->
4

1 に答える 1

1

Firefox エラー コンソールから、サイトの読み込み時に:

[02:31:52.279] ダウンロード可能なフォント: ダウンロードに失敗しました (font-family: "MyriadPro-BoldCond" style:normal weight:normal stretch:normal src index:1): 不正な URI またはクロスサイト アクセスは許可されていません ソース: http: //www.doig.com.au/wp-content/themes/brinkley/myriadpro-boldcond.woff @ http://brinkley.doig.com.au/wp-content/themes/brinkley/style.css?ver= 3.4.2

サイトは にありますbrinkley.doig.com.auが、フォントは から読み込まれていることに注意してくださいwww.doig.com.au。そしておそらく、サーバーは正しい CORS ヘッダーを提供していません。

Chrome で機能する唯一の理由は、Chrome がhttp://dev.w3.org/csswg/css3-fonts/#default-same-origin-restrictionを正しく実装していないことです。

于 2012-11-14T10:33:02.967 に答える