1

H₂O のように、下付き文字 2 を多用する Web サイトを構築しています。₂ は、タグではなく HTML コード ₂ で作成されます。

ここに問題があります。Internet Explorer では、₂ の後に大きなスペースがあります。#css でこれを修正するにはどうすればよいですか?

IE9 でのサイトのスクリーンショット

ここに画像の説明を入力

4

1 に答える 1

4

これはフォントの問題です。ページSUBSCRIPT TWO文字 (原則としては問題ありません) を使用しているため、完全な解決策はありません。HTML コードではなく、UTF-8 でエンコードされた文字として (これは問題ありません)、Open Sans フォントを使用しています。 、これは素晴らしいフォントですが、SUBSCRIPT TWO が含まれていません。これは、ブラウザーが何らかのフォールバック フォントを使用することを意味し、IE は、SUBSCRIPT TWO のグリフがグラフィックの右側に多くのスペースを持っているフォントを使用しているようです (これは、マウスで文字をペイントすることで確認できます。フォールバック フォントIE では、この場合の Batang のようなもののようです)。

これに対処するには 2 つの方法があります。

font-family宣言で、優先するフォールバック フォントをリストすることができます。の CSS ルールではbody、 の代わりに、font-family: 'Open Sans'たとえば次のように使用できます。

font-family: 'Open Sans', 'Calibri', 'Arial Unicode MS', 'DejaVu Sans', 'FreeSans',
  'Lucida Sans Unicode';

リストに何をどの順序で入れるべきかを言うのは難しいですが、上記はほぼすべてのブラウジング状況をカバーし、許容できるレンダリング結果が得られるはずです. 異なるフォントのグリフを混在させるという問題はまだ残っているため、結果はあまり良くありません。最適な結果を得るには、下付き文字を他の文字と同じフォントにする必要があります。

もう 1 つの方法は、Open Sans の代わりに別の基本フォントを使用することです。Google フォントの中では、Source Sans Pro を検討するかもしれません。これは素晴らしいサンセリフ フォント ファミリで、多くの書体 (ウェイトは 200 から始まります) があり、SUBSCRIPT TWO が含まれています。Google Web Fonts で [Latin Extended (latin-ext)] を選択するときは、[Latin Extended (latin-ext)] チェックボックスをオンにする必要があります。そうしないと、SUBSCRIPT TWO が含まれません。

于 2013-03-08T06:11:58.107 に答える