怎样创建略缩图 ？

• 最简单的方法是直接在 <img> 上设置 .img-thumbnail 样式;
• 也可以在 <img> 的父元素，如 <div> 上设置 .img-thumbnail 样式;
• 如果希望图像也是一个链接，则父元素应该是一个 <a>

<div class="row">
    <div class="col-xs-3">
        <a href="#" class="thumbnail">
            <img src="/images/me.jpg">
        </a>
    </div>

    ......
</div>

01.PNG

自定义的略缩图可以包含什么组件 ？

设置了 .thumbnail 中元素中可以添加图片、图片之后可以添加标题、文本内容、按钮、链接等等

<div class="row">

    <div class="col-xs-6">
        <div class="thumbnail">
            <img src="/images/me.jpg">
            <div class="caption">
                <h3>标题</h3>
                <p>内容巴拉拉小魔仙巴拉拉小魔仙巴拉拉小魔仙巴拉拉小魔仙巴拉拉小魔仙巴拉拉小魔仙</p>
                <p>
                    <a href="#" class="btn btn-primary">分享</a> 
                    <a href="#" class="btn btn-default">下载</a>
                </p>
            </div>
        </div>
    </div>

    ......

</div>

02.PNG