在設(shè)計網(wǎng)頁時,沒有比頁面的外觀更重要的了。所以,如果發(fā)現(xiàn)設(shè)計人員十分關(guān)注字體及字體大小,我并不感到驚奇。使用CSS來編輯字體有各種各樣的方法,每位設(shè)計師都會有自己偏愛的設(shè)計習慣,但必須選擇更能提高用戶體驗的方法。今天暴風彬彬?qū)⒓杏懻撟煮w大小的控制來體現(xiàn)更多的用戶體驗。
字體大小
CSS2規(guī)范中關(guān)于水平和垂直尺寸來定義字體的長度。這個長度為一個數(shù)值,前面可能帶一個可選的加(+)或減(-)標記符。另外,該數(shù)值后可能有一個可選的單位標識符。
另外,CSS2規(guī)范定義了兩個單位類型:絕對單位和相對單位。絕對值指定單位,而相對單位指定一個與另一個值成比例的值。下面的列表列出了相對單位標識符:
em:字體的高度,相對長度單位。相對于當前對象內(nèi)文本的字體尺寸。如當前對行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對于瀏覽器的默認字體尺寸(16px)。
ex(x-高度):CSS2規(guī)范將它描述為小寫字母x的高度。
px(像素):它與背景或屏幕的分辨率有關(guān)。根據(jù)顯示器分辨率輸出不同像素,由于用戶的喜好不同,顯示器的分辨率可能會有很大差異。
下面是有效的絕對單位標識符:
in(英寸)
cm(厘米)
mm(毫米)
pt(點,1點=1/72英寸)
pc(12點活字,1pc=12點)
測量絕對大小的另一種方法是使用衡量一個值的比例因數(shù),應(yīng)用以下關(guān)鍵字:最小、較小、小、中、大、較大和最小。中為基值,變小就減去一個因數(shù),變大就增加一個因數(shù),等等。CSS2規(guī)范定義的比例因數(shù)為1.2,這個值也可能依瀏覽器而變化。
還可以應(yīng)用百分比值來格式化文本。百分比值是一個可選的標記符,即數(shù)字后帶有一個百分比符號(%)。百分比值總是與另一個值成比例。就字體而言,它與網(wǎng)頁的基本字體大小成一定比例。
如您所見,有許多方法可完成呈現(xiàn)文本這個看似簡單的任務(wù)。下面的HTML格式文本(在段落元素中)應(yīng)用了各種單位標識符。其中所有的值都相等,并假定以72dpi進行顯示。
Point
Pica
Inches
Centimeters
Millimeters
Percentage
您可以在這個列表中增加像素值,但它的值要依環(huán)境而定。例如,我的分辨率為1280X1024的手提電腦將顯示與在上表中使用50像素值一致的文本。
仔細閱讀前面提到的CSS2規(guī)范,可以獲得更多字體大小方面的知識,F(xiàn)在我將討論如何決定在網(wǎng)絡(luò)應(yīng)用中使用哪種方法。
選擇哪一種方法
在CSS中有許多和字體有關(guān)的選項,但哪一種最適合在您的網(wǎng)絡(luò)應(yīng)用中使用呢?絕對大小有許多缺陷,特別是在一致性、靈活性與訪問性方面存在問題。與絕對字體大小相比,任何視力有缺陷的用戶可使用相對字體大小來擴大頁面中的文字,這樣更便于閱讀。因此,開發(fā)者經(jīng)常使用相對大小。
讓我們來詳細了解一下相對大小:
像素是最通用的大小值。多數(shù)瀏覽器都支持它,但也并非總是如此。瀏覽器常常將像素當作屏幕像素而非CSS像素來處理。像素的一個缺點在于,它忽略或否定用戶的喜好,且不能在IE中調(diào)整大小。
許多開發(fā)者偏愛用點來衡量字體大小,但點主要用于桌面印刷系統(tǒng),不方便移植到網(wǎng)絡(luò)中。在呈現(xiàn)文本時,操作系統(tǒng)或瀏覽器默認使用像素。
最常用的方法是使用em或百分比大小。EM可在所有支持調(diào)整尺寸的瀏覽器中進行調(diào)整。Em還與用戶偏愛的默認大小有關(guān)。在IE中應(yīng)用em的結(jié)果難以預(yù)料。在IE中最好使用百分比來設(shè)定文本大小。
下面的例子結(jié)合使用em和百分比值來對文本進行格式化;疚谋居冒俜直戎祦碓O(shè)置,然后用em來進行調(diào)整。
Basic text.
Larger text.
smaller text.
所有都與外觀有關(guān)
現(xiàn)有的標準提供許多格式化并呈現(xiàn)網(wǎng)絡(luò)應(yīng)用中的文本的方法。開發(fā)者可以很方便地將文本分解成相對和絕對標識符。關(guān)鍵在于保持一致,并徹底檢測解決方案。