1

メインドメインの下に CSS ファイルとフォントファイルの両方があります。

http://www.mydomain.com/cssおよびhttp://www.mydomain.com/fonts

一部のサブドメインにもファイルがあり、これらのファイルはメイン ドメイン ファイルの css とフォント スタイルを共有する必要があります。したがって、私はこれをファイルの先頭に置きます:

<link rel="stylesheet" type="text/css" href="http://www.mydomain.com/css/algemeen.css" media="all" />
<link rel="stylesheet" type="text/css" href="http://www.mydomain.com/css/gemeenten.css" media="all" />
<link rel="stylesheet" type="text/css" href="http://www.mydomain.com/css/sidebars.css" media="all" />

すべてうまく機能し、CSS は問題なく表示されます。ただし、これらの CSS ファイルでは @font-face を使用しています。このコード自体は、少なくともメイン ドメインのファイルに対しては、すべてのブラウザで正常に動作します。したがって、 http://www.mydomain.com/index.phpは、選択したフォントをすべてのブラウザーで完全に表示します。しかし、同じ CSS を使用している私のサブドメインの index.php は、IE または Firefox で選択したフォントを表示しません! 標準の Arial を使用するだけです。Safari、Opera、Chrome は問題なく動作します。これはどのように可能ですか？私の @font-face コード:

@font-face {
   font-family: "Nova"; font-weight: normal;
    font-style: normal;
   src: url("../fonts/proximanova-regular.eot");
}
@font-face {
   font-family: "Nova";
   src: url("../fonts/proximanova-semibold.eot");
   font-weight: 900;
}
@font-face {
   font-family: "Nova"; font-weight: normal;
    font-style: normal;
   src: url("../fonts/proximanova-regular.ttf") format("truetype");
}
@font-face {
   font-family: "Nova";
   src: url("../fonts/proximanova-semibold.ttf") format("truetype");
   font-weight: 900;
}

みんなありがとう！

fonts フォルダーに、このコードを含む .htaccess を既に追加しています。

<FilesMatch "\.(ttf|otf|eot|woff)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>
4

4 に答える 4

3

これは CORS の問題です。

http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

http://www.w3.org/TR/cors/

http://enable-cors.org/

より簡単な解決策は、フォント ファイルをコピーして、サブ ドメインに存在するようにすることです。CSS コードの大部分は問題あり@font-faceません。それは、ローカルのフォント フォルダーに相対的にリンクする新しいファイルに入れる必要があるコードだけです。両方のドメインで構造を同じに保つということは、特定のコードを作成する必要なく、CSS/フォントを単に c+p できることを意味します。

  • /www/
    • /css/
      • main.css -> 以外のすべて@font-face
      • font-face.css ->src: url("fonts/font.eot")
      • /フォント/
        • font.eot
  • /サブドメイン/
    • index.htm -> 参照http://domain.com/css/main.cssとcss/font-face.css
    • /css/
      • font-face.css ->src: url("fonts/font.eot")
      • /フォント/
        • font.eot
于 2012-09-26T06:16:22.303 に答える
0

フォントファイルへのファイルパスを確認しましたか? それは私が最初に見る場所です。サブドメインが Web ルートのサブフォルダーとして設定されている場合は、それらのファイルパスを変更する必要があります。

相対パスではなく絶対パスを使用することを考えてください: http://www.domain.com/fonts/proximanova-semibolt.tffの代わりに ../fonts/proximanova-semibold.tff

于 2012-09-25T22:03:23.893 に答える
0

すべてのフォーマットがあることを確認してから、重みを確認する必要があるかもしれません。mozilla はデフォルトで太字を使用することがあります。このコードは私にとってはうまくいきます。大いに役立つことを願っています。

IE は特殊なケースです。このため、 Prefix Freeというライブラリを使用できます。そして、ブラウザでの@font-faceのサポートを見てください

@font-face
{
    font-family: "MyFavoriteFont";
    src: url("KomikaTitle-webfont.eot");
        xsrc: url("KomikaTitle-webfont.eot?#iefix") format("embedded-opentype"),
     url("KomikaTitle-webfont.woff") format("woff"),
     url("KomikaTitle-webfont.ttf") format("truetype"),
     url("KomikaTitle-webfont.svg#KomikaTitleRegular") format("svg");
}
于 2012-09-26T06:26:48.717 に答える
0

CORSの問題のように聞こえます。解決策は、メイン サーバー上の .htaccess ファイルを更新する可能性が最も高いです。

この質問への回答を見ると、次のことが役立つと思います。

@font-face のインポートが、IE のみで CSS を介してオンライン フォントを使用するオフライン Web サイト/別のホストで機能しない

彼の問題は最終的にEOTファイル自体の問題でしたが、 CORSの問題は受け入れられた回答の元の回答セクションで対処されています。

于 2012-09-25T22:14:57.310 に答える