利用css如何設定font（字體）

CSS是網頁設計中最重要的一環，它可以讓網頁呈現各種不同的樣式和版面。其中一個最基本的CSS屬性就是font，也就是字體屬性。透過設定font，我們可以控制網頁中文字的大小、顏色、字體以及其他相關屬性。

以下是一些關於如何設定font的技巧和知識點，可以幫助你更好地掌握這個常用的CSS屬性。

1. 字號的設定

在CSS中，通常用font-size屬性來設定文字的大小。其值可以是像素（px）、百分比（%）、em、rem等。一般來說，像素作為絕對長度單位，更適合用於固定大小的佈局。例如，h1元素的字號可以設定為36像素：

h1 {

font-size: 36px;

}

而百分比和em等則更適用於相對長度單位和可伸縮設計的網站。例如，可以將段落元素的字號設定為1.2倍：

p {

font-size: 120%;

}

2. 字體的設定

##除了字號，字體（font-family）是另一個重要的屬性。透過設定font-family，我們可以更改文字的預設字體。通常情況下，一個網頁上可能用到的字體有多種。所以，在設定字體屬性時，可以用逗號分隔多個字體，從而確保訪客都能夠正確地呈現網頁上的字體。例如：

body {

font-family: "Microsoft YaHei", "SimHei", "Helvetica Neue", Helvetica, Arial, sans-serif;

}

在這個範例中，如果訪客的電腦上沒有第一個字體“Microsoft YaHei”，則會依序嘗試使用其他字體，直到網頁正確呈現為止。

加上粗體和斜體的設定

font-weight屬性可以用來設定字體的粗細程度。其值可以是normal（預設）、bold（加粗）、bolder（更粗）、lighter（更輕）、100-900（數字越大，字體越粗）等。

例如，h2元素的字體加粗：

h2 {

font-weight: bold;

}

font-style屬性則可用來設定文字是否出現斜體，其值可以是normal（預設）、italic（斜體）、oblique（傾斜）等。

例如，將一段文字設定為斜體：

p {

font-style: italic;

}

行高的設定

行高（line-height）是指文字行與文字行之間的垂直距離，其預設值為normal，即由字體本身來規定。透過設定line-height屬性，我們可以控制行與行之間的距離，從而影響段落的整體排版效果。

例如，將h3元素的行高設定為1.6倍：

h3 {

line-height: 1.6;

}

總之，透過精細地掌握font屬性，我們可以輕鬆調整字體的大小、顏色、字體、粗細和行高等各個方面，從而打造出優美而獨特的網頁設計效果。

以上是利用css如何設定font（字體）的詳細內容。更多資訊請關注PHP中文網其他相關文章！