0

これはやや自由回答の質問ですが、私は本当にこれを理解したいので気にしません。

2 要素の「テーブル」(スパン付きの CSS) があります。左の列には常に 20x20 ピクセルのアイコンがあります。2 番目の列には、アイコンに関連付けられた 1 行のテキストがあります。

IE6-8、Firefox 3.5、および Google Chrome でこれをまったく同じように表示するために思いつくあらゆる種類のアイデアを試しましたが、すべてのアイデアはテキストがせいぜい1 ~ 2 ピクセルずれることになります。

私は、<table>このリストをすべてのブラウザでまったく同じように見せるための絶対確実な方法を探しています。つまり、すべてのピクセルです。

4

6 に答える 6

2

あなたは動いているターゲットを追いかけています。非常に多くのブラウザと非常に多くのバージョンがあるため、おそらく完璧にする方法はありません。その後、たとえ完璧に近づけたとしても、いずれかのブラウザーの次のリリースで再び壊れる可能性があります。

于 2009-09-18T20:11:21.203 に答える
2

ピクセル パーフェクトは存在しません。ブラウザの範囲をそのように制御することはできず、そうしようとしても利益はありません。リターンの減少、あなたの名前は IE6 です。

<ul>fwiw、ここでは list-style-type を none に設定し、背景画像を使用して 20x20 アイコンを表示する単純なリスト ( ) を使用する方がよいように思えます。

于 2009-09-18T20:18:51.733 に答える
2

これが私の質問です。それが本当にテーブルである場合、なぜ使用しないの<table>ですか? 一般的なページ レイアウトの目的でテーブルを使用しないようにすることは 1 つの方法ですが、テーブル タグは、テーブルを表示する場合でも完全に正当です。

それでもうまくいかない場合は、<ul>変更などを検討してください。ただし、すべてのブラウザーで本当にピクセル パーフェクトになることはまずありません。

于 2009-09-18T20:19:13.277 に答える
0

はい...

画像をレンダリングします;)

(申し訳ありませんが、本当に「ピクセルパーフェクト」にしたい場合は、これがおそらく最も簡単な方法です)

于 2009-09-18T20:06:04.763 に答える
0

私はトニーアンナカタに同意します。ただし、通常、最良の結果は次のような単純なものから得られます。

<span><img src="images/icon.gif" style="vertical-align:text-bottom;" />Some text</span>

少なくとも、webkit、ie8、firefox ではまったく同じように見えます。(私もie7を信じていますが、テストしませんでした)

于 2009-09-18T20:21:01.883 に答える
0

質問を適切に読まなかったこの巨大な編集について申し訳ありません。一部の人がすでに言っているように、すべてのブラウザがページを異なる方法でレンダリングするため、ウェブサイトでピクセルパーフェクトを達成することは非常に困難です. CSS を使用すると、基本的にあらゆるものの絶対位置と相対位置を使用できますが、ブラウザー間の互換性に関しては完全とは言えません。

于 2009-09-18T20:22:04.767 に答える