我的 wordpress 画廊页面图像模糊

Question

我已经在 wordpress 中使用 Media grid 插件完成了我的画廊页面，但是在页面中发布画廊之后，缩略图有点模糊（但灯箱图像还可以），所以我希望它通过 CSS 代码来修复。 我附上了屏幕截图。

Answer 1

浏览器默认对调整大小的图像应用抗锯齿以使它们看起来更好。如果您希望撤消此行为，请使用image-rendering css 属性来撤消消除锯齿。

img {
  image-rendering: pixelated;
}

这是一篇解释得很好的文章：

https://css-tricks.com/almanac/properties/i/image-rendering/

---

解决此问题的更好方法（为了提高性能）是为缩略图使用较低分辨率的图像文件，并且仅在打开灯箱时加载完整尺寸的图像。

Answer 2

可能是为了调整大小的动作（拉伸的小图片）。

它与 CSS 无关，但您可以在 functions.php 中像这样设置缩略图大小：

add_image_size( 'category-thumb', 300, 9999 );