CSS中font-size屬性值四大種類
本文和大家重點學習一下CSS中font-size屬性值四大種類,我們用px作為文字大小的單位,已經(jīng)出現(xiàn)很多問題,現(xiàn)在IE瀏覽器是主流,但我們不能通過瀏覽器設(shè)置文字大小,因為我們用px作為文字大小的單位。
CSS中font-size屬性值四大種類
我們逐漸意識到,我們用px作為文字大小的單位,已經(jīng)出現(xiàn)很多問題。最主要是體現(xiàn)在用戶不能靈活的控制文字的大小,現(xiàn)在IE瀏覽器是主流,但我們不能通過瀏覽器設(shè)置文字大小,因為我們用px作為文字大小的單位。
對于大多數(shù)用戶來說或許這并無不妥,但對于年齡稍大及眼力不佳的訪客來說,他們不能按他們的意愿,通過瀏覽器來改變文字的大小。我們以“用戶至上”為原則,我們應該采取一種策略,不要求通過px為單位獲得100%的精確性,我們需要獲得更大的瀏覽器的可伸縮性與易用性,靈活的滿足訪客的需要。關(guān)于這類話題我們在以后51cto.com的教程中,與大家再進行深入的探討。我們今天對font-size屬性的值進行一些分析,看從中我們能得到一些什么啟示。
一、長度單位
長度單位分為兩種,一種是相對長度,另一種是絕對長度。
以下為三種相對長度單位:
◆em相對于父對象的大小
◆ex相對于特定字體中的字母x的高度
◆px相對于特定設(shè)備的分辨率,這是最最常用的單位,也是我們一直堅守的單位。從技術(shù)角度來說,px像素其實是一種相對大小的度量單位,它于特定設(shè)備的顯示或打印的分辨率有關(guān)。例如,一個像素在被顯示在計算機屏幕上與被打印在紙張上的大小是不同的。
以下為五種font-size屬性值絕對長度單位:
絕對長度單位在打印時或在屏幕顯示設(shè)備的物理尺寸已知時才比較有用。
◆in英寸
◆cm厘米
◆mm毫米
◆pt點
◆pc12點活字
二、相對大小的關(guān)鍵字
font-size屬性值相對大小的關(guān)鍵字只有兩個值:
◆larger
◆smaller
這兩個值的設(shè)定與父對象的設(shè)定值有關(guān)。我們可以像理解老式的<small><big>那樣來理解它們。它們是設(shè)定文字大小的最基本的方式,并會受到上層對象的文字大小定義的影響。
三、絕對大小的關(guān)鍵字
這類關(guān)鍵字共有7個,他們的實際大小根據(jù)不同的瀏覽器及設(shè)備來決定。
◆xx-small
◆x-small
◆small
◆medium
◆large
◆x-large
◆xx-large
W3C建立建議瀏覽器開發(fā)公司,將每個關(guān)鍵字之間的比例設(shè)定為1.5。并推薦讓這個比例保持恒定,媽medium是small的1.5倍。同樣large是medium的1.5倍。
四、百分比
font-size屬性值中使用百分比設(shè)置大小,將在容器對象文字大小的基礎(chǔ)上進行改變。如果我們設(shè)置body的文字大小為10。我們設(shè)置p的文字大小為150%,則p的文字大小就為15。不管10是什么樣的單位,百分比作為一種比例進行縮放調(diào)整。
我們可以從更深層次去思考,我們將在51cto.com以后的文章中進行發(fā)布,面對這些定義文字大小屬性值的單位,我們?nèi)绾螢橛脩籼峁┮粋€靈活的瀏覽環(huán)境,并允許他們按他們的意愿來控制文字的大小以更方便于瀏覽。
【編輯推薦】
- 詳解CSS布局技巧十則
- CSS布局中float和position屬性使用技巧
- CSS中實現(xiàn)DIV容器垂直居中方法揭秘
- CSS Sprites對CSS布局的意義及優(yōu)缺點
- CSS布局中display:inline-block屬性用法詳解