0

Vollkorn google フォントを使用した見出しがいくつかあります。Firefox と Chrome でのみ、デフォルトの太字と通常のフォント スタイルを使用すると、実際のテキストが要素の下の境界を超えて押し出されることに気付きました。斜体にすると元に戻ります。これは、フォントの太さが通常の場合には発生しません。

この動作を示す非常に単純な HTML ファイルを作成しましたが、問題は私だけに存在し、ファイルを他の人に送信しましたが、これらの 2 つのブラウザーでは問題ありませんでした。

これを jsFiddle で再現しようとしましたが、うまくいきませんでした。 http://jsfiddle.net/5WDJU/1/

a

これがPastebinのコードです。簡単にするためにjQueryを貼り付けました。 http://pastebin.com/yXzHqKrD

これは、私のコンピューターの問題を示すスクリーンショットです。 ここに画像の説明を入力

また、GoogleフォントのWebサイトにアクセスしてFirebugでスタイルを切り替えることでこれを再現しようとしましたが、うまくいきました。

jsFiddle やフォント Web サイトのように、これを修正する特定のスタイルがありませんか? それでも、ファイルを送信した人のコンピューターで発生しない理由がわかりません。これは、Google フォントの潜在的な落とし穴ですか?

4

2 に答える 2

0

おそらく、これは行の高さまたはパディングの問題です。クロムまたはサファリ (右クリック) で「要素の検査」を試し、入力フォームでアクティブなスタイルを表示します。リセットCSSを追加してみましたか？http://meyerweb.com/eric/tools/css/reset/

于 2013-08-08T16:40:46.373 に答える
0

さらに検索した結果、同じ問題が他の人に発生している 2 つのインスタンスを見つけることができました。これはもはや CSS の問題ではないと思いますが、問題が Google の実際のフォントによるものなのか、それとも Firefox と Chrome がこの特定のフォントをレンダリングすることをどのように決定したのかはわかりません。

ここに2つのリンクがあります。

http://code.google.com/p/googlefontdirectory/issues/detail?id=37 http://productforums.google.com/forum/#!topic/chrome/QofmpbyZ7sQ

最初のリンクから得た私の解決策は、FontSquirrel から太字の非イタリック フォントをダウンロードし、それを私のサイトに埋め込むことでした。

于 2013-08-13T14:09:14.923 に答える