Div CSS網(wǎng)頁(yè)布局中對(duì)字體的控制是非常重要的，對(duì)于需要精確效果的頁(yè)面而言。這類(lèi)設(shè)置會(huì)非常有用。對(duì)于一般用戶(hù)與開(kāi)發(fā)者而論，使用瀏覽器默認(rèn)字體即可，52CSS.com鮮有這方面的知識(shí)的介紹。此文分享了作者很獨(dú)特的CSS實(shí)踐經(jīng)驗(yàn)。從此文可以看出。對(duì)頁(yè)面字體的控制與設(shè)置的 　　DivCSS網(wǎng)頁(yè)布局中對(duì)字體的控制是非常重要的，對(duì)于需要精確效果的頁(yè)面而言。這類(lèi)設(shè)置會(huì)非常有用。對(duì)于一般用戶(hù)與開(kāi)發(fā)者而論，使用瀏覽器默認(rèn)字體即可，Webjx.com鮮有這方面的知識(shí)的介紹。此文分享了作者很獨(dú)特的CSS實(shí)踐經(jīng)驗(yàn)。從此文可以看出。對(duì)頁(yè)面字體的控制與設(shè)置的思考，將CSS的工作進(jìn)行的更加深入了。
body{font-family:Arial,sans-serif;}
　　這是我迄今發(fā)現(xiàn)的最好的全局字體解決方案。當(dāng)然，所謂“最好”，也只是基于我個(gè)人的評(píng)判標(biāo)準(zhǔn)。所以我還是得分析一下其他的寫(xiě)法有什么缺點(diǎn)，最后再總結(jié)這個(gè)寫(xiě)法的特點(diǎn)。
body{font-family:"宋體",sans-serif;}
　　這個(gè)寫(xiě)法可能的缺點(diǎn)在于：
　　1.宋體在Safari和Vista的IE7下，看起來(lái)很難看。（我稍后把截圖補(bǔ)上）
　　2.宋體的英文字很難看。
　　3.如果在CSS里寫(xiě)中文，你得小心你HTML和CSS的編碼是否一致。
body{font-family:SimSun,sans-serif;}
　　這樣寫(xiě)，可以避免上面的第三個(gè)問(wèn)題。但是宋體本身確實(shí)很難看。我們希望在不同平臺(tái)下，都用各自默認(rèn)的字體。XP是宋體，Vista是微軟雅黑，Mac是黑體。這樣的話(huà)，只能將字體的第一個(gè)設(shè)置為英文字體，這樣遇到中文的時(shí)候，瀏覽器會(huì)自動(dòng)調(diào)用默認(rèn)字體（VistaIE7的一些版本里貌似默認(rèn)還是宋體，這個(gè)我就無(wú)能為力了，交給用戶(hù)設(shè)置的自主吧）
body{font-family:Tahoma,sans-serif;}
　　這是一個(gè)不錯(cuò)的解決辦法。Tahoma其實(shí)是一個(gè)挺漂亮的字體（我同事喜歡稱(chēng)它“大河馬”，哈哈）。但是它其實(shí)會(huì)帶來(lái)一些問(wèn)題：
　　1.由Tahoma顯示的中文，在IE6里，下劃線(xiàn)會(huì)緊緊的貼住中文字，很難看。
　　2.IE6下，Tahoma無(wú)法.正確的設(shè)定為13px。它會(huì)跟14px一樣大。但是其他瀏覽器沒(méi)有這個(gè)問(wèn)題。
　　3.如果一行里同時(shí)出現(xiàn)中文和英文，且這一行里有元素被定義了vertical-align屬性，在IE6、7里會(huì)導(dǎo)致文字高低不齊，甚至下劃線(xiàn)錯(cuò)位。
body{font-family:Arial,ans-serif;}
　　上述兩個(gè)問(wèn)題，Arial都沒(méi)有。但是Arial也有缺點(diǎn)：
　　1.比Tahoma難看。
　　2.Tahoma里的第三個(gè)問(wèn)題也同樣存在。
　　不過(guò)，這個(gè)bug是有個(gè)解決辦法的，就是將這一行定義zoom:1。
　　所以，如果不嫌難看，定義為Arial是最合適的。如果實(shí)在不喜歡，可以將全局定義為T(mén)ahoma，然后再將有下劃線(xiàn)的（如鏈接）文字定義為Arial，至少可以緩解一下。
　　最后，對(duì)于全局字體，補(bǔ)充一點(diǎn)：
　　IE里，所有的表單元素都不繼承body的字體屬性，需要單獨(dú)設(shè)置：
input,label,select,option,textarea,button,fieldset,legend{
font-family:Tahoma,sans-serif;
}

最新評(píng)論