0

私は自分の開発サイトをクロスブラウザでテストしています。友人からのIE8のスクリーンショットを見た後、FF、IE9、Chromeですべてが非常に似ているのに、私のタイトルや段落の多くが新しい行に溢れているのを見てイライラしました。

特にIE8では、これらの新しいブラウザと比較して、文字の間隔が非常に広いように見えます。それらをすべて一致させるために私にできることはありますか?

これはそれを見るのに良いデモです:http://dev.enterf1.com/british-grand-prix/tickets.php

H2は-1pxに設定されており、新しいブラウザで見栄えがします。-2pxに設定すると、IE8の方がはるかに見栄えが良くなりますが、新しいブラウザーでは押しつぶされすぎます。

私にできることはありますか?

4

2 に答える 2

0

ブラウザには独自のスタイル シートがあります。CSS ノーマライザーまたはリセッターを使用して競争の場を平準化し、すべてのブラウザーが意図したとおりにスタイルをレンダリングできるようにします。IE8 には明らかに、ニーズに合った他のスタイルとは異なる基本スタイルがあります。

http://necolas.github.com/normalize.css/をチェックしてください

他に何もなければ、条件付きコメントを使用して ie8 の本体にクラスを設定し、そのクラス専用の CSS ルールを使用できます。次の点を考慮してください。

<!--[if IE 9]><body class="ie9 ie"><![endif]-->
<!--[if IE 8]><body class="ie8 ie"><![endif]-->
<!--[if IE 7]><body class="ie7 ie"><![endif]-->
<!--[if lte IE 6]><body class="ie6 ie"><![endif]-->
<![if !IE]><body><![endif]>

次に、次の CSS を検討してください。

h2 {
    font-size : 14px;
}

.ie8 h2 {
    font-size : 12px;
}

これにより、ie8のみで望ましい結果が得られます。

于 2013-02-01T19:46:02.483 に答える
0

おそらく、別のフォントを使用しています。たとえば、Win7/IE9 システムでは Segoe フォントを使用している可能性がありますが、WinXP/IE8 にはそのフォントがインストールされていないため、代わりに Ariel または Verdana に戻ります。

違いは非常に簡単に説明できます。これらのフォントは似ているように見えるかもしれませんが、テキストの幅には大きな違いがある可能性があります。

微調整して解決することもできますが、他のオペレーティング システムやプラットフォームのユーザーも異なるフォントをインストールしている可能性があり、物事の見方が異なる可能性があることに注意してください。サポートしたいタブレットやその他のデバイスでテストすることを忘れないでください。このようなものは、ほぼ確実に、デスクトップ ブラウザーとは異なる方法でレンダリングされます。

これはすべて、フォント サイズが自分のブラウザで表示されるのとまったく同じであることを信頼するのは、おそらく悪い考えであることを意味します。より良いアドバイスは、要素のスペースをテキストに合わせて少し大きいフォントにするか、必要に応じてサイズを調整できるようにすることです。いずれにせよ、物事をピクセルパーフェクトに強制しようとするのではなく、アダプティブレイアウトがおそらくここでの方法です.

于 2013-02-01T22:42:52.160 に答える