视网膜，懒惰的方式？答案

【问题标题】：Retina, the lazy way?视网膜，懒惰的方式？
【发布时间】：2014-10-26 01:59:26
【问题描述】：

我计划使用 Bootstrap 构建一个简单的静态站点，据我所知，它没有像 Foundation 那样对视网膜图像的内置支持。我很好奇，是什么阻止我将网站的所有图像制作成预期大小的两倍（例如 600x300），然后在将其放入代码中时将其缩小？

<img src="myImage.png" width="300" height="150">

我能想到的唯一问题是文件大小非常大的图像。在这种情况下，我可能需要找到一个可以很好地与 Bootstrap 配合使用的视网膜 JS 库。继续以懒惰为主题，希望能与 bower 和 grunt 一起将自己注入代码中。

【问题讨论】：

标签： retina-display retina

【解决方案1】：

您可以尝试将lazySizes 与respimage 结合使用。您的代码如下所示：

<img
    data-sizes="auto"
    src="lqip-src.jpg"
    data-srcset="lqip-src.jpg 100w,
    image2.jpg 300w,
    image3.jpg 600w,
    image4.jpg 900w" class="lazyload" />

【讨论】：