css對于字體和背景等屬性的控制

2024-07-11 08:42:59

字體：大中小

來源：轉載

供稿：網友

原文：http://jorux.com/archives/property-2-if-you-love-css/
上次主要說明了css對于顏色和文本屬性的控制, 這次介紹css對于字體, 背景等屬性的控制.
字體(Font)
css控制的字體屬性包括font-family, font-style, font-variant, font-weight, font-size.
1.font-family:
由字體名(family-names)和字組名(generic families)兩個部分組成.首先來看個實例,例:查看Jorux.com首頁的css文件,可以看到以下代碼:
body {
font: normal 12px/1.5 Georgia, sans-serif;
text-align:left;
background:#444 url(images/bodybg.jpg) repeat-y;
}
藍色加亮部分就是font的屬性值, 這種寫法為簡寫, 可將其還原為:
font-weight: normal;
font-size: 12px;
line-height: 1.5;
font-family: Georgia, sans-serif;
行高(line-height)其實并不屬于font屬性, 但可以在簡寫時歸入font屬性值內. 現在我們先只看最后一行font-family的部分. “Georgia“即為字體名(有simhei, arial, verdana等), “sans-serif“即為字組名(包括襯線字體(Serif), 非襯線字體(Sans-Serif) 和等寬字體(MonoSpace)三種).
由于Windows自帶的漢字字體極為有限. 但一般中文Windows系統都支持宋體(默認, SimSun)和黑體(SimHei)和楷體(kaiti_gb2312). 我們來看看這幾種漢字字體(要注意這幾種字體名, 楷體的英文字體名為kaiti_gb2312, Firefox對漢字字體支持不良):
宋體楷體黑體默認
中國人看到西方字體名可能會比較迷惑, 但就如同學習英文時所遇到的英文名一樣, 一些常用的字體名的表現和拼寫必須要掌握, 對于中文學習者, 目前只推薦掌握以下幾種英文字體:
Arial Verdana GeorgiaCourier
這幾種字體的一般用法如下:

Arial:

Verdana:

Georgia:

Courier:

英文有那么多字體, 但都隸屬于serif, sans-serif和monospace三種字組. 由于英文本身的特點, 不同于方塊字(漢字), 英文字母的寬度是不相等的, 這就給出版業如報紙的排版工作增加了難度, 于是發明了等寬字體(monospace).

上一篇：css對于顏色和文本屬性的控制

下一篇：css對邊框的屬性控制和鏈接的偽類選擇器