码迷,mamicode.com
首页 > 其他好文 > 详细

【Bootstrap】一个缩略图文组件

时间:2016-07-19 23:52:59      阅读:477      评论:0      收藏:0      [点我收藏+]

标签:

 <div class="row">
    <div class="col-sm-6 col-md-4">
    <div class="thumbnail">
//添加图片 宽度一定   高度随图片  也可设置
      <img src="images/demo1images/2.jpg" alt="2048">
      <div class="caption">
        <h3>影评网站</h3>//标题
        <p>我有一壶酒,聊以慰风尘</p>//文字介绍
        <p><a href="demo1.html" class="btn btn-primary" role="button">预览</a> </p>//按钮
      </div>
    </div>
    </div>
    
    </div>

效果展示如下:

技术分享

其中图片的宽度是一定的,高度随比例变换,以此为基础做瀑布流布局。

【Bootstrap】一个缩略图文组件

标签:

原文地址:http://www.cnblogs.com/wukall/p/5686618.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!