如何使用图片填充答案

【问题标题】：How to use Picturefill如何使用图片填充
【发布时间】：2014-08-19 20:27:13
【问题描述】：

我正在尝试为我的网站使用图片填充，但似乎两个版本都不起作用。

在我的页面头部：

<script src="js/picturefill.js"></script>

我有两张图片，welcome.jpg 用于较大的图像，welcome_sm.jpg 用于较小的图像：

<span data-picture data-alt="Welcome to Novus Landscapes">
<span data-src="images/welcome_sm.jpg"></span>
<span data-src="images/welcome.jpg" data-media="(min-width: 58em)"></span>
<noscript>
<img src="images/welcome_sm.jpg" alt="Welcome to Novus Landscapes">
</noscript>
</span>

我需要做其他事情才能让它工作吗？我没有看到任何东西，因为我的浏览器上启用了 Javascript，这当然消除了由于 noscript 标记而导致的回退。

我做错了什么？

我的网站是 novuslandscapes dot com

谢谢，

约翰

【问题讨论】：

标签： javascript web picturefill

【解决方案1】：

您需要做一些事情。

阅读或观看here
将脚本放在 html 底部，就在 </body> 之前

试试这个语法，复制自here

<article>
<img
     src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/small.png"
     srcset="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/large.png 1280w,
             https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/medium.png 640w,
             https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/small.png 320w"
     sizes="(min-width: 500px) 50%, 100%"  
     alt="A woman reading">
</article>

【讨论】：