如何調整bootstrap中grid之間的垂直距離 ?

发布于 2022-09-05 10:54:59 字数 1027 浏览 11 评论 0

1. 問題描述:

各位大牛午安,最近在使用bootstrap製作一個圖片的Gallery,我使用了bootstrap 的 Grid sysyem。我發現只要有圖片的高度與周邊圖片的高度不一,整個gallery就會多出很多空白(上下的距離不一),請問要如何調整成像是 Unsplash 這個網站的樣子?

2. 相關代碼:
<div class="row text-center" style="display:flex;flex-wrap:wrap;">
      
        <div class="col-lg-3 col-md-4 col-sm-6">
            <div class="thumbnail">
                <img src=image.jpg>" >
                <div class="caption">
                    <h3>description</h3>
                </div>
            </div>
        </div>

</div>
3.相關截圖:

會多出空白
如果照片的height越大,差距會越大。

4.已嘗試的做法:
在style中改變 display。
style="display:flex;flex-wrap:wrap;"

該如何調整grid 的上下距離?

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

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

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

蓝礼 2022-09-12 10:54:59

为什么不给图片设置一个百分比

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文