使用<small>標(biāo)簽可以將text設(shè)置為較小的font size。愛(ài)掏網(wǎng) - it200.com

<p><small>This text is small.</small></p>

CSS字體樣式

font-family

使用font-family屬性可以指定所選字體的font family，如sans-serif、serif或monospace。愛(ài)掏網(wǎng) - it200.com你還可以指定字體的具體名稱：

p {
  font-family: Arial, sans-serif;
}

font-size

使用font-size可以指定所選字體的大?。?/p>

p {
  font-size: 16px;
}

字號(hào)可以使用百分比或像素值。愛(ài)掏網(wǎng) - it200.com你還可以使用em值，它是相對(duì)于父元素字體的大小而計(jì)算的。愛(ài)掏網(wǎng) - it200.com

p {
  font-size: 110%;
  font-size: 0.8em;
}

font-style

使用font-style可以設(shè)置font的樣式：

p.normal {
  font-style: normal;
}
p.italic {
  font-style: italic;
}
p.oblique {
  font-style: oblique;
}

font-weight

使用font-weight可以設(shè)置字體的粗細(xì)：

p.normal {
  font-weight: normal;
}
p.bold {
  font-weight: bold;
}

font-variant

font-variant可以設(shè)置字體的變體，包括small-caps：

p {
  font-variant: normal;
}
p.small {
  font-variant: small-caps;
}

font

CSS的font屬性可包含所有以上屬性。愛(ài)掏網(wǎng) - it200.com以下是一個(gè)font屬性值的簡(jiǎn)略版：

p {
  font: font-style font-variant font-weight font-size/line-height font-family;
}

這個(gè)值可以指定所選字體的樣式、粗細(xì)、大小、font family和line height。愛(ài)掏網(wǎng) - it200.com

自定義字體

CSS3中引入了@font-face屬性，使開(kāi)發(fā)人員可以在Web 中使用自定義字體。愛(ài)掏網(wǎng) - it200.com

@font-face {
  font-family: customfont;
  src: url(fonts/customfont.ttf);
}

p {
  font-family: customfont;
}

我們使用@font-face來(lái)定義字體的名稱和其在服務(wù)器上的位置。愛(ài)掏網(wǎng) - it200.comsrc屬性可以指向字體文件，這可以是一個(gè)外部URL或一個(gè)相對(duì)的服務(wù)器地址。愛(ài)掏網(wǎng) - it200.com然后我們?cè)谛枰脑刂?，只要調(diào)用自定義字體名稱即可。愛(ài)掏網(wǎng) - it200.com

Google Fonts

除了使用自定義字體，你還可以從Google Fonts中選擇一種已經(jīng)被優(yōu)化的字體。愛(ài)掏網(wǎng) - it200.com

<link  rel='stylesheet' type='text/css'>

我們將此鏈接放在HTML文檔的head部分。愛(ài)掏網(wǎng) - it200.com然后我們可以將該字體應(yīng)用于我們的文本：

p {
  font-family: 'Open Sans', sans-serif;
}

總結(jié)

在HTML5中，有多種方法可以定制字體，我們可以使用舊版HTML中的字體標(biāo)簽，利用CSS來(lái)定義字體樣式，也可以使用@font-face自定義字體或從Google Fonts中選擇字體。愛(ài)掏網(wǎng) - it200.com通過(guò)對(duì)字體的精細(xì)處理，我們可以為我們的網(wǎng)站定制一個(gè)獨(dú)特和吸引人的外觀。愛(ài)掏網(wǎng) - it200.com同時(shí)，記得保持字體的可讀性，這是確保文章易于閱讀的關(guān)鍵。愛(ài)掏網(wǎng) - it200.com