內嵌列表項上的垂直對齊文本

Question

我有一個內聯的元素列表，列表中的元素有時可以是圖像或文本。圖像始終與列表高度相同，但我如何在列表中垂直對齊文本？

http://jsfiddle.net/qvuCm/

注：加價不能改變。

打算用CSS做這個，沒有JavaScript。

Answer 1

做了以下修改：

ul li a img{ 
    display:block; 
} 


a { 
    color: #000; 
    font-weight: 700; 
    text-decoration: none; 
    display:table-cell; 
    vertical-align: middle; 
    width:100px; 
    height:80px; 
} 

http://jsfiddle.net/qvuCm/12/

Answer 2

如果您將a樣式設置爲display: table-cell，則可以使用vertical-align(http://jsfiddle.net/whm8X/）例如， ：

a { 
    display: block; 
    height: 80px; 
    width: 100px; 
    display:table-cell; 
    vertical-align:middle; 
}