2

Chrome ではフォントを表示できますが、Firefox では表示できません。ブートストラップ フレームワークを使用しているため、これが問題なのかどうか疑問に思っています。これが私のコードです：

@font-face
{
    font-family:"bodyFont";
    src: url("http://caseymmiller.com/galapagos/fonts/museosans_300.otf");
}

body 
{
    margin: 0;
    font-family: "bodyFont";
    font-size: 15px;
    line-height: 20px;
    color: #333333;
    background-color: #ffffff;
}

また、サーバーにアップロードすると、クロムに表示されるフォントが1つだけになりました...ローカルソースが機能していなかったため、削除しました。私はかなり混乱しています。http://caseymmiller.com/galapagos/bootstrapInvasive/Invasive.html

これは私が今cssに持っているものです。前にリストしたものを試しましたが、各フォントの両方の URL を取得しても、いずれも表示されませんでした。そのため、一部は現在コメントアウトされています。これからも使っていきたいソースです。

@font-face
{
font-family:"headerFont";
src: url("http://livinggalapagos.org/static/Fonts/qhyts__.ttf");
/*src: url("http://livinggalapagos.org/static/Fonts/qhyts__.woff");*/

}

@font-face{
font-family:"subHeadFont";
src: url("http://livinggalapagos.org/static/Fonts/museosans_500.ttf");
src: url("http://livinggalapagos.org/static/Fonts/museosans_500.woff");

}

@font-face{
font-family:"bodyFont";
src: url("http://livinggalapagos.org/static/Fonts/museosans_300.ttf");
/*src: url("http://livinggalapagos.org/static/Fonts/museosans_300.woff");*/

}
4

2 に答える 2

0

@font-face複雑な性質です。「クロスブラウザ」のコーディングに役立つリソースをいくつか紹介します@font-face。

https://developer.mozilla.org/pt-BR/docs/CSS/@font-face

http://www.fontsquirrel.com/tools/webfont-generator

于 2013-02-21T17:39:45.600 に答える
0

2 つのプロパティにタイプミスがないかどうか疑問に思っています。

src: url('fonts/museosans_300-.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('fonts/museosans_300-.ttf')  format('truetype'), /* Safari, Android, iOS */

この二人じゃないかな 

src: url('fonts/museosans_300-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('fonts/museosans_300-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */

ファイル パスの末尾に 追加された Web フォントに注意してください。

これらの変更を行った後も、ブラウザのキャッシュを必ずクリアしてください。

幸運を！

于 2013-02-21T19:07:27.427 に答える