<div style="border:solid 1px #ccc;"><img style="vertical-align:middle;" src="http://imixc.com/content/images/close.png" />用CSS實現圖片和文字垂直置中對齊</div><br /><br />
<div style="border:solid 1px #ccc;"><img src="http://imixc.com/content/images/close.png" />這個是沒加樣式的效果</div><br /><br />
<div style="border:solid 1px #ccc;"><img align=absmiddle src="http://imixc.com/content/images/close.png" />這個是用align=absmiddle實現圖片和文字垂直置中對齊</div>
<div style="border:solid 1px #ccc;"><input type="image" id="cibtn" src="http://imixc.com/content/images/close.png" onclick="return false;"/>未實現圖片和文字垂直置中對齊</div>
<div style="border:solid 1px #ccc;"><input type="image" id="cibtn" src="http://imixc.com/content/images/close.png" align="absmiddle" onclick="return false;"/>實現圖片和文字垂直置中對齊</div>
AbsBottom 映像的下邊緣與同一行中最大元素的下邊緣對齊
AbsMiddle 映像的中間與同一行中最大元素的中間對齊
Baseline 映像的下邊緣與第一行文本的下邊緣對齊
Bottom 映像的下邊緣與第一行文本的下邊緣對齊
Left 映像沿網頁的左邊緣對齊,文字在映像右邊換行
Middle映像的中間與第一行文本的下邊緣對齊
NotSet未設定對齊
Right映像沿網頁的右邊緣對齊,文字在映像左邊換行
Top映像的上邊緣與同一行上最高元素的上邊緣對齊
TextTop映像的上邊緣與同一行上最高文本的上邊緣對齊
查了一下,absmiddle已經被W3C廢棄,採用如下方式
<div style="vertical-align:center;height:40px;border:solid 1px #ccc;">
<img style="vertical-align:middle;" src="http://imixc.com/content/images/close.png" alt=""/>
實現圖片和文字垂直置中對齊
</div>
<div style="vertical-align:center;height:40px;border:solid 1px #ccc;">
<input type="image" id="cibtn" src="http://imixc.com/content/images/close.png" style="vertical-align:middle;" onclick="return false;"/>
實現圖片和文字垂直置中對齊
</div>
</html>