使用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

火狐：

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及更高版本将允许您在CSS中指定image-rendering。你可以用这个CSS启用：

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

见文章image-rendering Mozilla的网站上了解更多详情 - 它同样适用，这听起来像你以后“任何元素的背景图像”。