我正在设计一个Wordpress网站,但我的图像尺寸有问题。
使用Chrome开发人员工具,我看到显示的图像尺寸不正确(通常导致屏幕上显示非视网膜版本)。另外,列出的“本征尺寸”不是完整上传的图像尺寸。
例如,在此页面https://theslowroad.org/back-to-the-middle-ages/上,在全角视网膜屏幕上,第一个图像(山上的城镇)应使用“宽” 1300px视网膜版本,第二个图像(城堡)应该使用“全列” 806像素视网膜版本,第三张图片(建筑物上的花朵)应该使用“中” 393x590px视网膜版本。
相反,在我的1486px Macbook屏幕上,第一张图片似乎使用856 px视网膜版本,第二张图片(城堡)使用1300 px非视网膜版本,第三张图片(建筑物上的花朵)正在使用650 ×975 px非视网膜版本。
以下屏幕截图显示了html和srcset以及正在使用的文件
https://theslowroad.org/wp-content/uploads/2019/07/Screen-Shot-2019-07-12-at-10.50.57-PM.png
它说:
392x590像素(本征650x975像素)
currentSrc:... 650x975.jpg
我的初始文件是1733x2600。 Wordpress使图像尺寸“中等”的590x590未被裁剪,而Retina2x使图像的尺寸相等。我在Gutenberg图像块中使用了“中”字号。那么它在哪里得到650x975?为什么不使用393x590 @ 2x?