标签: srcset

我已经编写了一个 JavaScript 填充器来实现srcset，但我需要澄清指定的行为。

虽然srcset允许您指定宽度或分辨率的条件，但我无法确定是否可以同时指定两者。例如：

<img src="images/oh1x408.jpg"
    srcset="images/oh1x192.jpg, images/oh1x408.jpg 420w,
    images/oh2x192.jpg 2x, images/oh2x408.jpg 2x 420w">

这应该涵盖单分辨率和双分辨率，以及更小和更宽的屏幕。

我没有看到指定宽度和分辨率的示例。问题是：

• 上srcset例中的最后一张图片是否符合规格？
• 示例中的其他内容是否不正确？

谢谢

在Wordpress 4.4 中，图像会自动获得一个srcset属性。我的问题如下（我在写这个问题时解决了它，请参阅下面的答案）：

• 为了将所有内容传输到 https，我将posts 表src="http://...中的所有引用替换为（后来我将其更改为支持这两种协议）；src="https://...src="//...
• 所有帖子上的图像在src属性中都获得正确的 URL；
• 然而，在所有获取该属性的图像中，srcset其中的 URL 始终带有http://引用。

为什么会出现这种情况？为什么这些网址没有得到我最新更新的https://开头？

一个HTMLImageElement有一个currentSrc属性,因此,我们可以得到一个的电流源img元素.在定义多个可能的源时很有用srcset.

似乎没有HTMLPictureElement的等价物.

有没有其他方法可以picture使用Javascript 找到元素的当前来源？

我应该写这个吗

srcset="small.jpg 1x 500w, medium.jpg 2x 1000w, large.jpg 3x 1500w"

或这个

srcset="small.jpg 500w, medium.jpg 1000w, large.jpg 1500w"

两个表达一样吗？

Wordpress自动为来自帖子的所有图像添加属性srcset。sizes那\xe2\x80\x99s 非常整洁。

但是如何让 WordPress 将这些属性添加到来自定制程序输入的图像中呢？

就我而言：帖子的默认图像。当帖子中未上传图像时，会显示该默认图像。它\xe2\x80\x99s由用户通过定制器上传并使用调用get_theme_mod。

来自帖子的图像（工作正常，所有属性均已添加）：

get_the_post_thumbnail($post->ID, \'news\', array(\'class\' => \'img-responsive\'));\n

如果未提供图像：加载默认图像（没有 \xe2\x80\x99scrset\xe2\x80\x99 和 \xe2\x80\x99sizes\xe2\x80\x99）

\'<img src="\' . esc_url( get_theme_mod( \'default_image\' ) ) . \'" alt="default image" class="img-responsive" />\'\n

wp_image_add_srcset_and_sizes()似乎是要走的路，但它需要我不\xe2\x80\x99不知道从哪里获得的属性。

感谢您的帮助！

我试图<img srcset />根据图像在页面上显示的大小来加载图像，而不是根据视口的大小。也许例子会有所帮助：

• 在任何视口上，当图像width: 100%在 200px 宽内设置样式时<div>，img-200.jpg应该加载。
• 在任何视口上，当图像的样式设置为400pxwidth: 100%宽时，应该加载。<div>img-400.jpg
• ...ETC。