如何在div内对齐<a><img></a>标签

Question

我有一个链接列表，其中包含在div标签内的图像。 图像的大小是动态设置的，高度固定为父div宽度的25％，宽度自适应。 我已将float：left属性设置为图像以实现网格样式，但现在我想将图像居中在div内。 这是一段代码：

 <div>
    <a title="gallery" href="images/silvia.b&amp;w.jpg" data-gallery="">
        <img src="thumbnails/silvia.b&amp;w.jpg_New.jpg" style="height: 162.55625px;">
    </a>
    <a title="gallery" href="images/silvia 165.jpg" data-gallery="">
        <img src="thumbnails/silvia 165.jpg_New.jpg" style="height: 162.55625px;">
    </a>
    ...other images
 </div>

以及CSS：

#text a img{
    position:relative;
    margin:0.5%;
    float: left;
    border: 1px solid #999;
    padding: 0.5%;
    background: #000;
    -webkit-filter: grayscale(100%);
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}
#text a img:hover {
    -webkit-filter: none;
    -webkit-transform: scale(1.85,1.85);
    -moz-transform: scale(1.85,1.85);
    -o-transform: scale(1.85,1.85);
    -ms-transform: scale(1.85,1.85);
    transform: scale(1.85,1.85);
    z-index:100;
}

如何将图片居中显示？

- user3098549

Answer 1

如果您删除 float: left，它们将与其父div元素的text-align:center属性结合使用而居中显示。

也就是说，它们的直接（第一个）父div元素；请给这个元素添加一个id属性。

- Andy G

---

谢谢，那就是解决方案！ - user3098549

Answer 2

我使用：text-align:center，如果不行就尝试调整宽度并使用float:left和text-align:center。

- FBC