CSS文件中的字體設(shè)置決定了網(wǎng)頁中文字的外觀,如字號、字體、顏色等。在CSS中,通過font-family
屬性來定義字體,可以使用font-family
屬性來指定一個或多個字體以及Font-Size屬性來設(shè)定字號。下面我們來分別講解一下這兩個屬性的用法。
font-family
屬性可以在CSS中定義一組備用字體,瀏覽器會按照該字體列表的順序逐個查找,直到找到在客戶端計算機上已經(jīng)安裝的字體。因此,為了保證網(wǎng)頁在不同的客戶端機器上顯示效果一致,應(yīng)該首先使用萬能字體,如 sans-serif、serif、monospace 等,這些字體已經(jīng)被普遍支持。
p{ font-family: Times, Arial, sans-serif; }
在這個例子中,瀏覽器會先查找細明體(Times),如果沒有找到就在用 Arial ,如果還是找不到就使用 sans-serif 萬能字體。如果在這組字體中有中文或其他特殊字符的話,建議將中英文字體分開定義,或者使用@font-face來引入自定義字體 。
除了上述屬性外,還可以使用font-size
屬性來設(shè)置字體大小。字號一般以像素(px)為單位,也可以使用其他單位,如 em、rem等。像素的好處是顯示的精度高,但如果用戶將瀏覽器設(shè)置為放大或縮小模式時,網(wǎng)頁上的字號就會變得異常,所以網(wǎng)站還應(yīng)該設(shè)置相應(yīng)
的法則來適配各種狀態(tài)下的設(shè)備。
p{ font-size: 16px; }
正確使用字體屬性可以讓網(wǎng)頁文本易于閱讀,符合設(shè)計規(guī)范。但過多的字體設(shè)置會使HTML文件的文件體積過大,影響加載速度,因此應(yīng)盡量避免使用可以選擇的字體系列和不必要的字體樣式,保證網(wǎng)頁加載速度的同時,也合理美化文章排版。