如何设置Bootstrap 3水平缩略图

7lrncoxx 于 2023-01-10 发布在 Bootstrap

关注(0)|答案(1)|浏览(153)

我正在使用this demo。为什么我不能设置一个水平缩略图来显示缩略图右侧的标题，而不是默认的图像下方？

<div class="col-md-6">
    <div class="thumbnail clearfix">
        <div class="col-md-3">
            <img src="https://v1.myhometheme.net/wp-content/uploads/2017/01/cozy-apartament.jpg" alt="...">
        </div>
        <div class="col-md-6">
           <div class="caption">
        <h3>Thumbnail label</h3>
        <p>...</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>
    </div>
</div>

twitter-bootstrap

来源：https://stackoverflow.com/questions/44616532/how-to-set-up-bootstrap-3-horizontal-thumbnail

1条答案

按热度按时间

6yoyoihd1#

结构是正确的，但图像是巨大的
http://jsfiddle.net/ngb3n9gx/

<div class="col-md-6">
    <div class="thumbnail clearfix">
        <div class="col-md-3">
            <img src="http://via.placeholder.com/200x200" alt="...">
        </div>
        <div class="col-md-6">
           <div class="caption">
        <h3>Thumbnail label</h3>
        <p>...</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>
    </div>
</div>

您必须设置图像宽度

赞(0）回复(0）举报 2023-01-10

我来回答

如何设置Bootstrap 3水平缩略图

1条答案

相关问题

热门标签

最新问答