可以看到下面的截圖圖1，左邊圖片，右面是文字，就會(huì)存在文字與圖像的對(duì)齊問題。我們期待的是文字不要這么靠下。最初試圖通過padding and margin都沒有很好的解決。

事實(shí)上，本質(zhì)原因是圖文混排的默認(rèn)值是vertical-align:baseline.顯示效果為圖一?；€是在圖片最底部還要靠下的位置。

當(dāng)我們?cè)O(shè)置為vertical-align:middle 或者vertical-align:bottom 都可以改變文字對(duì)齊。圖2是將對(duì)齊方式改為居中的效果。

雖然代碼簡(jiǎn)單，但是學(xué)習(xí)之初，經(jīng)常會(huì)忽略這類小問題的本質(zhì)原因。

Ps:腳本之家的解釋更為詳盡http://m.jb51.net/css/177178.html

圖1

圖2