css - 在 Chrome 中缩小图像时图像模糊

Question

Chrome 版本 55.0.2883.87（64 位）

我有一个宽度为 225 像素的图像。如果我只是将其缩小 1px，图像就会变得非常模糊。FF不会发生这种情况。

这是一个例子：https ://jsfiddle.net/keqx1vt8/2/

li {
  list-style-type: none;
  width: 224px;
}

img {
  max-width: 100%;
}

<ul>
    <li><img src="http://i.imgur.com/Ks3QUUr.png"></li>
</ul>

图片是 225px，我把最大宽度设置为 224px。单个像素对图像质量有很大影响（仅在 Chrome 中）。我尝试过使用图像渲染，但没有取得多大成功。