ホームページ > 記事 > ウェブフロントエンド > IE6.0 では、float:left を使用した li タグの垂直高さは、English の方が Chinese_html/css_WEB-ITnose よりも 1px 低くなります。
IE6.0 では、float:left を使用した li タグの垂直高さは、English の方が Chinese_html/css_WEB-ITnose よりも 1px 低くなります。
- WBOYオリジナル
- 2016-06-24 12:11:32932ブラウズ
<ul style="list-style:none;text-decoration:underline;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;padding-top:1px;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li></ul>
ディスカッション（解決策）に返信
元の投稿者の意味がわかりません
padding-top:1px と書くとどうなるでしょうか？
宛先: 1 階
このコードはまだ試していないようです。 IE6.0で開いてみると、この行を書いた意味が分かると思います
真ん中の3つは面一で、最初と最後のは真ん中の3つより1ピクセル上にあります
その英語を示すために書きました中国語の1px下、padding-top:1pxよりも優れています。3番目のliを1px下に移動して、側面に合わせます
それらの位置関係は「- _ _ _ -」であり、ここにローカル画像をアップロードする方法はありません
<!DOCTYPE HTML><html> <head> <meta charset="gb2312" /> <title></title> <style> </style> </head> <body> <ul style="list-style:none;text-decoration:underline;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html>
padding-top:1px を削除すると、ここでのテストは水平になります。
投稿者がデモ全体を投稿するのが最善です
4 階へ:
コードは完成しました。他の CSS はありません。すべてのコンテンツを * として保存するだけです。 html。
3階に掲載されている写真を見てください。よく見ると1pxの高さの違いがあることがわかります。
IE6.0のブラウザを使用していますか？ IE6.0.2900.5512
フォントを拡大しても元の投稿者の高低差が分かりません
<!DOCTYPE HTML><html> <head> <meta charset="gb2312" /> <title></title> <style> body { font-size:31px; } li { text-decoration:underline; } </style> </head> <body> <ul style="list-style:none;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html> ie6, 7, 8 ff opera を試しましたが、問題ありません
テストしたところです長い間、何かが間違っていると思っていました 超自然的な出来事については、比較を繰り返すことで発見されました:
まったく同じコードであっても、ページのエンコーディングは UTF-8 でなければバグが発生しませんが、GB2312 ではバグが発生しませんバグの原因
観察により、これら 2 つのエンコーディングの英語フォントは実際には異なることがわかりました。 また、GB2312 の英語の幅も異なります。
では、このようなバグの原因は何でしょうか?コーディングやページUIを変更せずに解決するにはどうすればよいでしょうか?
文字セットとフォントの問題については、まず本文で Web サイトで使用する文字セットとフォントを定義します。 Microsoft Yahei を使用していると思います。 Song Princess に変更してみてください
Microsoft Yahei は使用しません。他に いかなる コードもまったくありません。li に float:left という完全な HTML コードを使用するだけです。すべてを直接コピーし、ファイルとして保存します。 * utf-8.html ファイルで、このような状況に遭遇したプログラマーの友人は多いのではないでしょうか?このコードは非常に一般的に使用されていると考えられます
このバグを確認する手順:
1. IE が 6.0 であることを確認します
2. メモ帳を開きます
3. 1 階のすべてのコンテンツをコピーしてメモ帳に貼り付けます
4. メニュー- >ファイル->名前を付けて保存し、エンコードに UTF-8 を選択し、拡張子に html を選択します
5. 保存したファイルをダブルクリックします
====
上記の手順に従うと、私が言及したバグが確実に表示されます。
助けてください…
誰か助けてくれませんか…
大丈夫ですか？ 4 階で提供されたコードは、ここでテストすると問題ありません
投稿者はなぜエンコード方式を UIF-8 に変更したいのでしょうか?それに変更することには問題がありますが、なぜそれに変更するのでしょうか？
Web サイト自体は UTF-8 でエンコードされていますが、この問題のためだけに Web サイト全体のエンコードを変更したとしても、少しは改善されるのではないでしょうか。さらに、UTF-8 はユニバーサルエンコーディングです。さらに、そのようなバグが存在するのですから、コーディングを変更して回避するだけではなく、その原因を究明する必要がありますよね。フォーラムに参加しているプログラマは、何が起こっているのかを知っただけで満足しているだけで、その理由は分からないのでしょうか?
この問題は、中国語と英語の解析の異なるエンコーディングの異なるベースラインによって引き起こされるはずです。
例えば、この
<!DOCTYPE HTML><html> <head> <meta charset="utf-8" /> <title></title> <style> body { font-size:50px; font-family:arial; } li { text-decoration:underline; } </style> </head> <body> <ul style="list-style:none;"> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> <li style="float:left;">English</li> <li style="float:left;">中文</li> </ul> </body></html> ie6、7、8 では、文字 "g" が下線を超えてしまい、下線がオフセットされます
ff と chrome では、文字 "g" が下線を超えてしまいますが、下線はまだ非常に平坦です。 。 。
私は表面だけを見ました。具体的な状況については研究し議論する必要があります。 。 。 。
誰かがブルーでそれについて議論しました、
まずは見てみましょう
http://bbs.blueidea.com/thread-2878142-1-1.html
とても感謝しています、ついに誰かが理解してくれました、ただ、残念ですが、これらすべてを確認し、今提供していただいた投稿も注意深く読み、この問題を修正する方法は次のとおりであると結論付けました:
1. 属性を追加します。それを言うには、zoom:1;vertical-align:baseline;display:inline-block; の 3 つの方法があります
しかし、私の試みでは、それらはすべて無効です。
2. フォントを変更します。これは影響が大きすぎるため、良いアイデアではありません。
CSS Hack を通じてこの問題を解決する方法はありますか? (方法 1 と似ています)。
ありがとうございます。
ポスターはとても思慮深いです。 。 。
http://gigalens.com/2009-07/webstandards-ie6-typographiy-bug.html
すごいですね
え？結局、結論は「フォントを変える」しかないようですね。
じゃあ、運命を受け入れるしかないですね。
もっと「きれいな」コードを書きたいだけです。