图像标题在居中图像下方左对齐

Question

我有一些带有标题的图像。图像位于网站中央，标题应显示在图像下方。到目前为止非常简单，但问题是：标题应该左对齐并从图像的左下角下方开始（就像在报纸中一样）

我可以想到一个带有表格的解决方案，但我不喜欢它，因为表格在这里显示表格数据，而不是图像和图像标题

表解决方案：

<table class="centered-table">
  <tr><td class="image"><img src="stackoverflow.jpg" /></td></tr>
  <tr><td class="caption">Unanswered question on stackoverflow.com</td></tr>
</table>

Answer 1

我会使用<figure>和<figcaption>来display: table获得你想要的效果。

请参阅此示例