2016-11-08 5 views
0

私は特別なフォントスタイルのために@ font-familyを使用していますが、Google Chromeのブラウザで正しく動作しますが、Firefoxでは正しくはありません。レンダリングの問題:フォントがFirefoxで平滑化されなくなりました...私のフォントはFirefox上でレンダリングされません。また、Google Chromeにもあります

この問題を解決できるのは誰ですか?

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
\t <meta charset="UTF-8"> 
 
\t <title>Document</title> 
 
\t <style> 
 
\t \t @font-face{ 
 
\t \t \t font-family: example; 
 
\t \t \t src:url(./fonts/rasmi.otf); 
 
\t \t } 
 
\t \t .myFont{ 
 
\t \t \t font-family: example; 
 
\t \t \t font-size: 40px; 
 
\t \t } 
 
\t </style> 
 
</head> 
 
<body> 
 
\t <p class="myFont">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ex aspernatur debitis esse unde quia delectus natus, atque nesciunt optio consequuntur ducimus facere magnam, corporis eligendi totam molestias nostrum a earum.</p> 
 
</body> 
 
</html>

+2

関連するコードを表示する必要があります。異なるブラウザは、異なるフォント形式をサポートしています。 –

+0

おそらくScott Marcusと同じフォントフォーマットです。これを見てくださいhttps://css-tricks.com/snippets/css/using-font-face/ –

+0

@ScottMarcus上記のコードは、私が新しいフォントファミリをどのように使用するかを示すサンプルであり、両方でうまくいきますchrome&firefox ...しかし、私のプライマリコードでは、私はそのスタイルを使用していたと私は同じ結果を持っていません... Firefoxでそれは少しピクセルとスムーズではないようです(クロムのような) – martin

答えて

0

Firefoxできれいなアンチエイリアスを得るためにあなたのCSSで体に

-moz-osx-font-smoothing: grayscale; 

を追加します。

+0

残念ながらそれはdiffrenceを作っていません – martin

+0

申し訳ありません、あなたは-webkit-font-smoothing:antialiasedを含める必要があります。 Mac以外のクライアントの場合 – Korgrue

1

は、あなたの体に

-webkit-font-smoothing: antialiased; 

を使用してみてください。

関連する問題