HTML/CSSのピクセルで画像をスケーリングしますか？

Question

私のdivでは、画像の特定の部分（その部分は8x8ピクセル）を表示したい（オリジナル画像では8x8ピクセルを表示するために、背景ポジション：-8px -8px;）が必要ですが、拡大します」保存されたピクセル」。だからあなたは得る http://piclair.com/86m3r 代わりにスケールアップしたとき http://piclair.com/lxn12

誰かが今これを達成する方法なら、教えてください。私は本当にこの問題を解決する必要があります！

Answer 1

CSS画像補間プロパティのより完全なリストは、こちらにあります。 http://www.danolsavsky.com/article-images-interpolation-browser-rendering-and-css-resizing.html

Firefox：

image-rendering: optimizeSpeed;

image-rendering: optimizeQuality;

image-rendering: -moz-crisp-edges;

オペラ：

image-rendering: -o-crisp-edges;

クロム：

image-rendering: -webkit-optimize-contrast;

IE 8+：

-ms-interpolation-mode: nearest-neighbor;

W3C標準：

image-rendering: optimize-contrast;

Answer 2

画像スケーリングは、さまざまな方法でさまざまなブラウザーによって処理され、これらの画像のスケーリング方法を指定する公式の方法はありません。

ただし、Firefox 3.6以上で指定できます image-rendering CSSで。このCSSで有効にすることができます：

img {
    image-rendering: -moz-crisp-edges;
}

の記事を参照してください 画像レンダリング 詳細については、MozillaのWebサイトでは、「あらゆる要素の背景イメージ」にも適用されます。