如何在HTML中使文本與圖像中心垂直對齊？

Question

因此，我在HTML中有一個圖片“ blah.jpg”和一個名稱“ Name”。

    <img src="blah.jpg"> Name

我要使其名稱與blah.jpg圖像的中心居中對齊，而不是在圖像底部具有基線的文本“名稱”。

如果可能的話，沒有表格的最佳方法是什么？

Answer 1

在頁面中：

<img src="blah.jpg" class="centered"> Name

在css文件中：

img.centered {vertical-align:middle;}

無需顯示：內聯代碼塊（某些舊版瀏覽器不支持）

Answer 2

您可以在img元素上使用vertical-align：middle： http : //jsfiddle.net/Z35pw/ 。

Answer 3

如果您想要單行而不定義額外的對象或屬性，只需在<img .../>標記內添加style="vertical-align:middle" 。