5 月に、Microsoft は、Windows XP でダウンロードできる Yahei フォントを正式に提供しました。 Yahei フォントは、特に液晶ディスプレイ (LCD) の小さな宋体の文字の判読不能の問題を解決した、ほぼ完璧なフォントです。ClearType 効果をオンにすると、より完璧な視覚的楽しみが得られます。私は今、弥平に魅了されています。宋時代のデフォルトのシステムを振り返ると、ギザギザがあまりにも明白で醜いです。
ただし、これに伴う問題は、Yahei フォントが Internet Explorer での Web ページのレイアウト表示に多少のずれを与えることです。これまでに私が発見した問題は主に 2 つの側面にあります。
1. 下線が取り消し線になることがあります。
実際、これは視覚的なずれであり、英語と中国語が混在する段落では、下線が壊れて非常に不規則になります。
以下は、google.cn のホームページにある中国語のテキストのハイパーリンクです。
この現象は中国語フォントでのみ発生し、英語フォントは影響を受けません。
中国語と英語が混在している場合は、さらに明白になります。
中国語の文字がある場合は下線が上に移動されており、英語には影響がないことがわかります。
2. Internet Explorer で行の高さが変更される
以下は、ブログ内の背景画像を含むハイパーリンクのスクリーンショットです。
Song フォントの下の元の通常のスタイルが以下に表示されます。これは、Internet Explorer で行の高さが増加していることを示しています。しかし、Firefox では何も変わりません。
3. 問題を解決してみます。Google.cn
のスクリーンショットでは、右側の「ログイン」ハイパーリンクが正常であることがわかりました。これは、すべての中国語のハイパーリンクにこの問題があるわけではないことを示しています。これらのハイパーリンクのスタイルの違いを注意深く比較しました。左側のリンクには、右側の「ログイン」よりも追加のスタイルがあることがわかりました。vertical
-align:top;
この属性をブロックした後、すべてがうまくいきました。 「Meizu Forum」の 3 番目のスクリーンショットでは、テキストにはvertical-align が表示されていませんが、次の 2 つの小さな画像に表示されていることがわかりまし
た
。
したがって、中国語のハイパーリンクでvertical-alignを使用すると必ず問題が発生します(すべての要素にvertical-align属性があるわけではありません)。最も簡単な解決策は、vertical-alignまたはvalignの使用を避けるか、スーパーリンクの使用を避けることです。もちろん、これは問題を正しく処理するための良い方法ではありません。
私のブログで再現された問題に関しては、Yahei フォントによって Internet Explorer で行の高さが増加することを示しているだけです (Firefox では正常に表示されます)。問題は、 height を制御するだけですが、インライン要素なので高さを設定できないため、 disaply:block と連携して高さを固定する必要があります(ただし、 block 属性を設定した後、自動行折り返しが行われます)。この場合、float と他の属性を併用する必要があります)。この方法で上記の問題も解決できることがわかりましたので、ハイパーリンクの高さを固定する方が良い方法です。
追記: Windows XP をベースにデフォルトのフォントを変更したため、問題が発生する可能性があります。上記の 2 種類の問題が、Yahei フォント自体に起因するのか、その他の不適切な設定に起因するのかを判断するのは困難です。 。この問題が Vista システムのテストにも存在するかどうかはわかりませんでした。条件を知っている人がいたら、テストを手伝ってください。
注: この問題は Internet Explorer のすべてのバージョンに存在しますが、Firefox は影響を受けません。