放大<img/>时禁用插值

Question

当HTML5页面上有img元素时，插值将应用于img，
当用户放大页面时。
但是，如果您在页面上有一些pixelart并且不想要插值，则 仅仅因为它破坏了尖锐的像素，你做了什么？ 我的问题很简单：如何在纯HTML5 / CSS中禁用插值？

Answer 1

img {
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
}

当您设置img尺寸（在CSS或属性中）时，这将影响渲染，但在用户缩放页面时不保证会影响渲染。

MDN: image-rendering CSS property

Answer 2

在Chrome中使用：

img {
    image-rendering: pixelated;
}

有关此属性的更多信息-https://css-tricks.com/almanac/properties/i/image-rendering/