css - bootstrap - 在列内添加 div 以水平对齐

Question

我是 Bootstrap 的新手，搜索无果(包括堆栈溢出)，但似乎无法解决这个问题。我有一个使用 Bootstrap 的简单 12 列网格。我有一列“”。我需要添加动态数量的图像以水平对齐并在不适合时换行。我可以用简单的图像 (img src="">) 来做到这一点，但每个图像都需要包装在一个 div 中(它们是产品图像，所以每个图像都有很多格式化信息)。当我这样做时，它们彼此垂直对齐。我试过在 div 中使用“float: left”并尝试不设置格式但结果相同。

我错过了什么？现在的代码很简单，但我还是会添加它:这可以满足我的要求(水平列出图像)但不包含在 div 中。

<div class="col-sm-12">
    <img class="categoryImages" src="images/image1.png">
    <img class="categoryImages" src="images/image1.png">
    <img class="categoryImages" src="images/image1.png">
</div>

或者这不起作用 - 它垂直列出图像。

<div class="col-sm-12">
    <div><img class="categoryImages" src="images/image1.png"></div>
    <div><img class="categoryImages" src="images/image1.png"></div>
    <div><img class="categoryImages" src="images/image1.png"></div>
</div>

Answer 1

在你的 CSS 中设置:

div {显示:内联}

或者为您的 div 设置一个特定的类名，并将其也设置为内联。