返回介绍

img 类

发布于 2025-02-25 22:08:38 字数 1295 浏览 0 评论 0 收藏 0

使用 bootstrap 内置类可以把图片套圆角、套圆、套白边:

<img src="http://placehold.it/125x125" class="img-rounded" />
<img src="http://placehold.it/125x125" class="img-circle"/>
<img src="http://placehold.it/125x125" class="img-thumbnail"/>

利用好 bootstrap 的布局能力,做出类似缩略图集的 UI 很容易:

<div class="container">
    <div class="row">
        <div class="col-xs-3">
            <a href="#" class="thumbnail">
                <img src="http://placehold.it/125x125" alt="125x125"/>
            </a>
        </div>
        <div class="col-xs-3">
            <a href="#" class="thumbnail">
                <img src="http://placehold.it/125x125" alt="125x125"/>
            </a>
        </div>
        <div class="col-xs-3">
            <a href="#" class="thumbnail">
                <img src="http://placehold.it/125x125" alt="125x125"/>
            </a>
        </div>
        <div class="col-xs-3">
            <a href="#" class="thumbnail">
                <img src="http://placehold.it/125x125" alt="125x125"/>
            </a>
        </div>
    </div>
</div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文