5

css スプライト ピクセル アート イメージを拡大しようとしていますが、アンチエイリアシング/イメージ スムージングを完全に無効にしたいと考えています。

ここのこの投稿ごと：画像をスケーリングするときにアンチエイリアスを無効にする次のcssを試しました

image-rendering: optimizeSpeed;            
image-rendering: -moz-crisp-edges;         
image-rendering: -o-crisp-edges;           
image-rendering: -webkit-optimize-contrast; 
image-rendering: optimize-contrast;       
-ms-interpolation-mode: nearest-neighbor;

Firefox で望んでいたのとまったく同じように機能しましたが、Chrome と IE では少し役に立ちましたが、画像の補間/平滑化/アンチエイリアシングがまだ発生しています。

canvas 要素を使用したくはありませんが、CSS の背景画像スプライトに固執するだけです。

他のブラウザで「-moz-crisp-edges」と同じ結果を達成する方法はありますか?

4

1 に答える 1

3

悪いニュース:

残念ながら、キャンバスを使用するか、JavaScript を使用するか、Chrome と IE でアンチエイリアスを使用するかのいずれかを選択できるようです。

アンチエイリアシングを使用することを選択しない場合に、他の 2 つのうちの 1 つに役立つ可能性のある応答を次に示します。

リンク:

  1. Javascript のみのソリューション - 古くて遅いが、どこでも動作する
  2. キャンバス ソリューション - 新しい、高速、準拠していないブラウザーでは機能しない

申し訳ありませんが、これに関して良いニュースはありません。

于 2014-10-31T16:54:01.523 に答える