CSS 如何控制HTML內的文字造型

今天來講 CSS 如何控制HTML內的文字

font-style 字型
首先在文字設定時最基本的- 表示為 font-style: "新細明體" ,helvetica ,serif;

可以指定多組不同的字型在同一個元素上，因為字型會因為每個使用者電腦的狀態不同而出現缺少這個字型的情況，所以CSS裡可以用兩種指定方式來設定字型，如果使用者電腦裡沒有這個字型，就會用下一種，所以第一種就是字型的名字像是"新細明體"、"華康中黑體"，使用時要用"" 把字型名稱包起來。
另一種就是 serif sans-serif cursive fantasy monospace
這幾個是字型的基本樣式，學過設計的都知道，字體有幾種基本的差別，襯線有無、粗細、圓字、黑體、等寬，另一種就是單純指定形式，然後電腦就會去系統裡找最類似的來使用，就是傳說fallback啊!!

font-style 文字樣式：
有四個參數： normal | italic | oblique | inherit
正常，斜體，斜體，繼承，有兩種斜法，italic 是找字型裡有 italic斜體設計的，oblique 系統自己幫你斜，所以多半是用italic

font-variant 變種字型
有三個參數：normal | small-caps | inherit
其實就是正常還有，把小寫全變成比較小的大寫字

font-weight 字型粗細
參數有兩種類型，一種是 normal | bold | bolder | lighter | inherit
普通，粗體，更粗，更細

另一種是直接用數字表示 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
其中 bolder | lighter 更粗，更細是對照其母元素的文字設定

font-size 字級
有兩種表現法，一種是直接給定數字，像10px; 10pt等等
另一種是給相對大小，比如 2em (字級為母元素字級的2倍)，110% (字級為母元素字級的110%)
或是用 xx-small x-small small medium large 來表示。

=

chibc's blog |[新手前端]從平面設計前進 CSS-9 字型