18

次のロゴは、FF3 の HTML 本文と同じ背景色として表示されます。Chrome (#363636)。

しかし、IE8 では、別の暗い色が表示されます。

これは FF3/Chrome が私の PNG を許しているのか、それとも別の IE バグ (IE7 での PNG サポートを修正したと思っていたのか) ですか?

更新:私はまだこの問題を抱えており、それを修正するために使用する pngcrush 引数は次のとおりです。

pngcrush -replace_gamma 0.5181347 infile.png outfile.png

Win32 バイナリ リンクはこちらです。

4

7 に答える 7

22

PNG にガンマ補正情報 (gAMA チャンク) 構造があります。ガンマ補正が必要な写真を扱う場合は問題ありませんが、Web には適していません。

Web では、ブラウザーは通常、HTML/CSS の色やその他の画像にガンマ補正を適用しないため、ガンマ補正を使用すると、ページの残りの部分と一致しない PNG の結果が得られます。一部のブラウザーは、この正確な理由で PNG ガンマを適用しません。これが、変数の結果が得られる理由です。

ロゴをイメージ エディターに読み込み、gAMA チャンク情報なしで保存します。もっと

于 2009-03-19T16:59:20.800 に答える
6

ここでの最高評価の回答は、pngcrushを使用してガンマ値0.5181347に奇妙なリセットを行うことを示唆しています。これは一部のユニバースでは機能する可能性がありますが、私たちの最善の方法は、PNGからすべての色空間情報を取り除き、ブラウザがCSSの色に使用しているのと同じニュートラルRGBトリプレットスペースで純粋にレンダリングされるようにすることです。

pngcrush -rem cHRM -rem gAMA -rem iCCP -rem sRGB infile.png outfile.png

これが実際のカラーヘッドにとって意味することは、設計した元の色が別のモニターやオペレーティングシステムで同じように表示されない場合があることですが、同じRGB値を持つすべての色は、ブラウザーに応じて各ユーザーに対して同じ方法でレンダリングされます+。 os彼らはオンになっています。具体的には、PNGに隣接する背景色または隣接する色が一致するため、画像と色を連動させてサイトをデザインできます。

于 2010-09-19T18:52:10.143 に答える
2

Internet Explorer での PNG の色の問題と、スクリーン ショットを使用したその解決策について説明しました。解決策は、PNG 画像からガンマ チャンクを削除することです (たとえば、TweakPNG ユーティリティを使用します)。これにより、画像が Internet Explorer で正しい色合いでレンダリングされます。一部の一般的でないブラウザーは、依然として不安定な動作をする場合があります。

于 2011-03-08T12:48:16.930 に答える
0

これは私のために働いた唯一の解決策です: http://forum.jquery.com/topic/transparent-png-shows-black-edges-in-ie8

于 2010-12-08T09:34:59.483 に答える
0

Yahoo Smushitを使用して Web 用に画像を最適化することで、この問題が解決されたことを知っておくと、他の人にとって役立つかもしれません (一般的に、これまたは類似の方法で画像を実行することをお勧めします)。

于 2013-03-12T23:20:27.700 に答える
0

すべての IE (6、7、8) でこの問題に気付きました。一部の PNG 画像では、透明な領域の周りに黒い輪郭が表示されます。Gimp (無料のクロスプラットフォームの画像エディター) を開き、問題のある PNG を開き、あいまい選択ツールを 150% で使用して透明領域を再選択し、[削除] をクリックする必要があることがわかりました。その後、再保存します。これにより、通常、透過領域の PNG の周囲のしみが約 98% 解決されました。

それでもうまくいかない場合は、Gimp でリロードし、背景を白に設定し、[画像を平坦化] を選択し、[あいまい選択] のしきい値を 3% に設定し、削除する背景を選択し、[削除 (クリア)] を選択してから、背景をもう一度選択し直しますしきい値を 150% にして、画像を削除してから再保存します。

私のファジー選択ツールでは、私のGimp設定は、アンチエイリアシングをチェックし、フェザーエッジのチェックを外し、透明な領域を選択をチェックし、サンプルマージをチェックを外し、コンポジットで選択したことに注意してください。

ええ、これは透明な背景を持つ PNG 画像の IE バグのようです。他のブラウザ (Opera、Safari、Firefox、Chrome) には、この問題はありません。問題があるのはエッジのみであるため、一部の画像プログラムは、エッジのアンチエイリアシングの一部として 50% の透明度を設定していると思われます。IE 以外のブラウザはピクセルの 50% の透明度を処理していると思いますが、IE はピクセルの 100% の透明度のようにしか理解できないかもしれません。

于 2009-10-26T20:41:14.353 に答える