Question

我正在使用Wordpress，并希望基于wp_get_attachment_image_srcset显示正确的图像大小。当我调整大小时，浏览器正在更改图像，但无法按照应有的步骤进行操作。

这些是我在functions.php中的大小

add_image_size('s320', 320, 240, true);
add_image_size('s640', 640, 480, true);
add_image_size('s992', 992, 744, true);
add_image_size('s1280', 1280, 960, true);
add_image_size('s2000', 2000, 1500, true);
add_image_size('s2600', 2600, 1950, true);

在我的index.php上，当一栏小于768时，我将大小设置为100vw；如果小于两栏，则将其设置为100vw。 wp_get_attachment_image_srcset设置srcset的尺寸

<img src="data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs="
    srcset="...image-2000x1500.jpg 2000w,
    ...image-50x38.jpg 50w,
    ...image-320x240.jpg 320w, 
    ...image-640x480.jpg 640w, 
    ...image-992x744.jpg 992w, 
    ...image-1280x960.jpg 1280w"
    sizes="
            (max-width: 768px) 100vw,
        (max-width: 2000px) 50vw,
        2000px" 
    alt="Alt-text" class="lazyLoad img-fluid">

浏览器正在做什么：

for a screen < 226: displays currentSrc as 320
225 < screen < 398: as 640
397 < screen < 564: as 992
563 < screen < 1599: as 1280
and then display as 2000

这些步骤似乎对我没有逻辑...我希望浏览器遵循我的步骤。我究竟做错了什么？

Answer 1

尝试在结尾处不包含true并添加如下优先级：

add_image_size('s320', 320, 240, false, 9999);

Wordpress wp_get_attachment_image_srcset根据媒体大小选择错误的图像

1 个答案: