垂直居中對齊文本

好吧，這裏就是這個HTML元素看起來像現在：垂直居中對齊文本

enter image description here

我想文字與圖像的中心。圖像是32x32px。

這裏是我的代碼：

<style> 
div.interface { 
    line-height: 32px; 
    float: left; 
    margin: 10px; 
    width: 450px; 
    font: 14px/27px 'CalibriRegular', Arial, sans-serif; 
    color: #646464; text-shadow: 1px 1px 1px #fff; 
    padding-right: 10px; 
} 
</style> 

<div class="interface"><img src="assets/icons/interface.png" />Filled with fun animations and eye-candy! Complete with Retina graphics.</div>

來源

2011-02-10 sudo rm -rf

檢查這個問題出：HTTP ：//stackoverflow.com/questions/4414034/how-to-vertically-align-elements-in-html/4414069#4414069 – JCOC611 2011-02-10 03:05:10

@JCOC：看起來只是我需要的東西。對不起，我沒有足夠的搜索。不妨在這裏複製你的答案，這樣我就可以接受答案。 :) – 2011-02-10 03:07:57

Nah，沒關係！我已複製粘貼我的答案，並編輯了一下，以適應更多的情況！ – JCOC611 2011-02-10 03:10:47

要居中文本垂直設置的行高到相同的高度，例如：

img{ height: 30px; } 
#text{ line-height: 30px; }

和垂直取向設置爲中間：

#text{ line-height: 30px; vertical-align:middle; }

來源

2011-02-10 03:10:00 JCOC611

添加style="vertical-align: middle"您<img />標籤。

有關vertical-align標記的完整說明，請參閱http://phrogz.net/CSS/vertical-align/index.html。

來源

2011-02-10 03:07:54 LucasTizma

垂直居中對齊文本

回答

相關問題