■ 字體

在 CSS 中常見的字體 (font) 屬性有以下幾種：

每一個屬性在以下會有詳細地介紹：

 

◎ font-family

font-family 屬性是用來設定字體的類別。
CSS 樣式 顯現結果

p {font-family: verdana;}

Font Family Verdana.

p {font-family: arial;}

Font Family Arial.

p {font-family: impact;}

Font Family Impact.

 

◎ font-size

font-size 屬性是用來設定字體的大小。

大小可以是以數字顯現 (絕對的或是相較的均可)，

或是以下其中之一的值："xx-large"、 "x-large"、 "large"、 "medium"、 "small"、 "x-small"和 "xx-small"。
CSS 樣式 顯現結果

p {font-size:9px;}

字體大小為 9px。

p {font-size:150%;}

字體大小為 150%。

p {font-size:0.8cm;}

字體大小為 0.8 cm。

p {font-size:small;}

字體大小為 small。

p {font-size:large;}

字體大小為 large。

 

◎ font-weight

font-weight 屬性是用來設定字體的厚度。厚度的設定值可以從 100 到 900 (900 是最厚的)。

我們也可以將厚度設定為 bold (厚)、bolder (更厚)、及 normal (正常)。

如下面例子：
CSS 樣式 顯現結果

p {font-weight: 200;}

這是厚度 100。

p {font-weight: 900;}

這是厚度 900。

p {font-weight: bold;}

這是 bold 厚度。

 

◎ font-style

font-style 屬性是用來設定字體是否為斜體字 (italic 或 oblique)。
CSS 樣式 顯現結果
p{font-style: italic;}

這是斜體字。

 

◎ font-variant

font-variant 屬性是用來設定文字是不是要以小型大寫 (small caps) 字體。

在小型大寫字體中，所有的字母都是大寫，可是字體是比一般大寫來得小。

可能的值為 "small-caps" 和 "normal"。來看下面的例子：

CSS 宣告：

span {
  font-variant:small-caps;
}

以下的 HTML 碼：
<span>initial in small caps</span> AND LATER IN LARGE CAPS.

就會顯現出：

initial in small caps AND LATER IN LARGE CAPS.