html - 试图将一些图像 div 居中。什么是最好的方法？DIV 还是表格？附上一些代码

Question

我正在尝试将 3 个图像图标居中。我选择了 DIVs 而不是 TABLE 标签作为更现代的方法，但是有一些问题，比如我不能让它居中。

这是代码：

    <div style="text-align:center;">
        <div style="">
            <div><img src="../../Content/images/Image1.png" alt=""/></div>
            <div>Image1</div>
        </div>
        <div style="">
            <div><img src="../../Content/images/Image2.png" alt=""/></div>
            <div>Image2</div>    
        </div>
        <div style="">
            <div><img src="../../Content/images/Image3.png" alt=""/></div>
            <div>Image3</div>
        </div>
    </div>

我有一种奇怪的感觉，解决方案很简单。我确实尝试过“float:left”让图标聚集在一起，但后来无法让“clump”居中。

基本需要：

Image1  Image2  Image3
    Image4  Image5

提前谢谢了。

Answer 1

尝试使用内联块，也不需要将所有内容都包含在 div 标签中：P，您也可以尝试使用 span 标签而不是那些 div。

<div style="text-align:center;">
    <div style="display: inline-block;">
        <img src="../../Content/images/Image1.png" alt=""/>
        %br
        Image1
    </div>
    <div style="display: inline-block;">
        <img src="../../Content/images/Image2.png" alt=""/>
        %br
        Image2    
    </div>
    <div style="display: inline-block;">
        <img src="../../Content/images/Image3.png" alt=""/>
        %br
        Image3
    </div>
</div>