html - 使用 Bootstrap 的小查询

Question

我正在帮助一个 friend 做网站，需要一些建议。我们之前在这里询问过，并被告知更新服务器上所有必要的 jQuery 文件，完成了，但仍然损坏。

网站:3six-d.co.uk

如果你去投资组合，你会看到所有的图片都是乱七八糟的，不是行，而是列。 我用它来设置间距:

<div class="col-md-4">
  <a class="fancybox-test" data-fancybox-group="thumb" href="images/portfolio-03.png"><img src="images/portfolio-preview-03.png" alt="" /></a>
</div>

需要说明的是，我已经从 Bootstrap 2 升级到 3。但是我已经按照说明升级了所有语法。 (无论如何我希望)但仍然没有运气，他们只是不会像以前那样排队(列之间的间隙和等间距的图片)。

我自己对此做了一些研究，我所能找到的只是它们必须全部位于容器 div 中，它们就是这样。

这让我发疯，所以我希望得到一些帮助!

谢谢

Answer 1

您可以将以下 CSS 添加到您的图片中。

.fancybox-test > img {
    width: 100%;
    vertical-align: middle;
}

vertical-align: middle 属性移除图像底部的填充。