基本上快被這個(gè)問(wèn)題搞瘋了,癥狀如下

癥狀描述:在ie下(6或7,8沒(méi)有試過(guò))當(dāng)出現(xiàn)中英文混排,都采用默認(rèn)字體時(shí),并使用 li 列表做float時(shí),會(huì)出現(xiàn)如上圖的癥狀,文字排列上下不對(duì)齊的情況。影響了布局的美觀性,造成上圖情況的原因是中英文的文字基線(xiàn)不同,arial字體的下邊緣要比宋體(同為12號(hào))低一個(gè)象素,上邊緣比宋體矮兩個(gè)象素,而且英文還有i,y這種上下基線(xiàn)不同的情況。所以當(dāng)中英文混排對(duì)齊時(shí),就會(huì)出現(xiàn)明顯的高度差異,使排版不均??梢?jiàn)放大圖。

采用中英文字均使用宋體的方案

可以解決文字排列不對(duì)齊的情況,但宋體英文字是襯線(xiàn)字體(Times New Roman即是英文中的襯線(xiàn)字),字型緊湊,細(xì)節(jié)較多,排列在一起很醒目,但在連續(xù)成文時(shí),容易造成辨識(shí)困繞,看錯(cuò)行的情況。關(guān)于襯線(xiàn)字體的優(yōu)缺點(diǎn),請(qǐng)見(jiàn)這篇文章。相比之下,表示英文還是使用無(wú)襯線(xiàn)字體更美觀大方。
解決方法一 “餃子”童鞋的 發(fā)現(xiàn)。
英文采用tahoma字體–宋體,arial及 tahoma字體比較–arial與tahoma的無(wú)襯線(xiàn)體比較精致

當(dāng)中英文混排時(shí),使用tahoma字體的情形

中英混排,純中文組合的行高都一致了,但a在hover狀態(tài)下下劃線(xiàn)與中文粘聯(lián)在一起。
缺陷:使用tahoma字體時(shí),在ie6及ie6以下版本,會(huì)導(dǎo)致所有中文字體鏈接的下劃線(xiàn)會(huì)出現(xiàn)與字體粘連現(xiàn)象。淘寶使用的也是這一解決方案。相信大型項(xiàng)目,不同的人來(lái)共同完成一個(gè)頁(yè)面的模塊時(shí),在統(tǒng)一的規(guī)范下,使字體更規(guī)范,減少錯(cuò)位,而采用帶有下劃線(xiàn)會(huì)出現(xiàn)與字體粘連的tahoma字體,是值得的
以下是攜同大米童鞋 發(fā)現(xiàn)的:
英文采用arial字體,中文使用宋體??稍赼>標(biāo)簽內(nèi)注明 line-height:1.231,可解決行高不等以及字體與下劃線(xiàn)粘連問(wèn)題。(不知道大范圍中英文混排適不適用,有待后續(xù)校驗(yàn)。)

總結(jié):感謝大米,感謝餃子,感謝YUI,感謝淘寶!