html - 如何将文本置于图像下方居中，无论文本大小如何

Question

假设我有一个图像。

<img src="lala.png" />

此图像的宽度为 width=400px;。

我想在此图像下输入“Lala”。

<img src="lala.png" />
<br>
<span>Lala</span>

请注意，我将从数据库中获取这些图像和文本，图像的宽度固定为 400px，但文本的大小当然会有所不同，所以我不能使用 margin -left:100px; 将文本推到中间，因为它在其他文本上看起来会错误...

最好的方法是什么？

Answer 1

您可以使用 div 代替 span。

HTML:

<div class="underImage">Blah</div>

风格:

.underImage {
    width: 400px;
    text-align: center;
}