0

我正在使用 bootstrap3 构建带有缩略图的产品列表页面。我想使用来自 Bootstrap 的缩略图,它反过来bootstarp也使用Holder.js. 我在这里这里都阅读了文档。

他们都在谈论这个语法:在你加载 js 文件之后。

<img src="holder.js/200x300">

我试图检查并查看图像源的检索位置和方式,因为我想在 PHP 中使用 foreach 加载它。

这是我的检查结果:

持有者 js 和引导程序

因此,正如您从图像中看到的那样,有些data:svg...东西我不明白。

结束我的问题:

  1. 如何使用 hodelr.js 加载图像?
  2. 是否需要转换才能在缩略图视图中看到所有图像?
  3. Hodler.js 在哪里可以检索图像,您如何动态地进行检索?

我有以下我没有看到的svg:generated

 <div class="thumbnail">
           <img data-src="holder.js/100%x200" alt="100%x200"  class="img-thumbnail img-responsive" src="../assets/images/products/ring.jpg" data-holder-rendered="true" style="height: 200px; width: 100%; display: block;">
           <div class="caption">
            <h4>Thumbnail label</h4>
            <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
            <p><a href="#" class="btn btn-primary" role="button">Button</a> <a href="#" class="btn btn-default" role="button">Button</a></p>
          </div>
        </div>

太感谢了!

4

1 回答 1

2
<img src="holder.js/200x300">

Holder.js 是一个图像占位符。它将代码呈现为图像。

将您的代码更改为如下所示的真实图像并设置尺寸。

<img src="you image path + image " width="200" height="300">
<img src="images/apple.jpg" width="200" height="300">
于 2014-12-22T13:03:05.490 回答