当我使用 HTML 和 CSS 将图片显示为其原始大小时,图片就是完美的(当然)。
如果我尝试以大于原始尺寸的尺寸显示它,但如果最终尺寸更小,我预计它会变得模糊。这就是正在发生的事情:我的照片在任何情况下都是模糊的。
问题是网站和图片是响应式的,我无法为所有可能的尺寸创建缩略图,但我仍然需要结果是脆的。至少没有那么模糊。
我在网上搜索并找到了这个 CSS:
image-rendering:-moz-crisp-edges; /* Firefox */
image-rendering:-o-crisp-edges; /* Opera */
image-rendering:-webkit-optimize-contrast; /* Safari */
image-rendering:optimize-contrast; /* CSS3 Proposed */
image-rendering:crisp-edges; /* CSS4 Proposed */
image-rendering:pixelated; /* CSS4 Proposed */
-ms-interpolation-mode:nearest-neighbor; /* IE8+ */
它有效,但它给了我完全相反的结果:它太脆了,图片上出现了伪影(点)。我分别尝试了它们,但没有成功。要么全有,要么全无。
就像您在 Photoshop 中拍了一张像样的照片并将锐度滑块推到最大。无论哪种方式,它都太极端而无法使用。
我使用 php、jquery、html 和 css 是否可以使用其中之一解决我的渲染问题?
谢谢。