Questions tagged «srcset»

img具有srcset属性看起来像是一种制作响应式图像的好方法。cssbackground-image属性中是否存在等效的语法？ 的HTML <img src="small.jpg" srcset="medium.jpg 1000w, large.jpg 2000w" alt="yah"> 的CSS .mycontainer { background: url(?something goes here?); }

89 html  css  background-image  srcset 

我一直在尝试srcset通过浏览器开发人员工具查看我的浏览器正在使用哪个图像，但是除了使用“网络”标签来查看它无法获取的图像之外，我一直在尝试。 使用网络选项卡通常会很好，但是有时我注意到它会获取两个不同大小的图像版本，如果一个断点位于600，另一个断点位于900，并且浏览器当前宽度为750px，则会发生这种情况。 （我已经在Chrome和FireFox上都尝试过此操作，在某些情况下，Chrome可能会拉下这两个图像，但是FireFox似乎只会拉下一个） 我想知道的原因是我是否对它缩放两个图像srcset剂量感兴趣，并在缩放浏览器窗口时自动在它们之间交换？这不能通过检查元素来判断，它只是给出了元素的原始html img，而不是img srcset其使用的实际选项。

80 html  css  responsive-design  developer-tools  srcset 

我一直在尝试使用以下HTML实现新的srcset方法来响应图像 <img class="swapImages" srcset="assets/images/content/large.jpg 1200w, assets/images/content/medium.jpg 800w, assets/images/content/small.jpg 400w" sizes="100vw" src="assets/images/content/small.jpg" alt="responsive image"> 我使用的是chrome 40，我得到的只是最大的图像，调整了浏览器的大小，清除缓存没有任何作用。 我读了一些我必须进行polyfill的地方，所以我使用了picturefill插件，尽管chrome应该支持它。 我为此放了一个演示页：http : //www.darrencousins.com/lab/resp-img-srcset/ 我在做什么错/不明白？ 任何帮助深表感谢。

71 image  responsive-design  srcset