在制作網(wǎng)站時，字體樣式涉及文字型體效果，包括字體類型、字體大小、字體顏色等基本效果，還包括字體粗細(xì)、下劃線、斜體、大小寫等特殊效果。文本樣式主要涉及文本排版效果?！?/span>
CSS使用font-family屬性來定義字體類型，另外使用font屬性也可以定義字體類型。
?font-family是字體類型專用屬性，用法如下：
font-family : namefont-family : ncursive |
fantasy | monospace
| serif | sans-serif
name表示字體名稱，可指定多種字體，多個字體將按優(yōu)先順序排列，以逗號隔開。在網(wǎng)頁設(shè)計時，如果字體名稱包含空格，則應(yīng)使用引號括起。第二種聲明方式使用所列出的字體序列名稱，如果使用fantasy序列，將提供默認(rèn)字體序列。
?font是一個復(fù)合屬性，該屬性能夠設(shè)置多種字體屬性，用法如下：
font : font-style || font-variant || font-weight || font-size || line-height ||
font-familyfont : caption | icon | menu | message-box | small-caption | status-bar屬性值之間以空格分隔。
font屬性至少應(yīng)設(shè)置字體大小和字體類型，且必須放在后面，否則無效。前面可以自由定義字體樣式、字體粗細(xì)、大小寫和行高，詳細(xì)講解將在后面內(nèi)容中分別介紹。
【示例】啟動Dreamweaver，新建一個網(wǎng)頁，保存為test.html，在<body>標(biāo)簽內(nèi)輸入一行段落文本。
<p>定義字體類型</p>
在<head>標(biāo)簽內(nèi)添加<style type="text/css">標(biāo)簽，定義一個內(nèi)部樣式表，然后輸入下面樣式，用來定義網(wǎng)頁字體的類型。
body { font-family:Arial, Helvetica,
sans-serif; /*字體類型*/}
p {/* 段落樣式 */ font:14px "黑體";
/*14像素大小的黑體字體*/}
中文網(wǎng)頁字體一般多定義為宋體類型，對于標(biāo)題或特殊提示信息，如果需要特殊字體，則建議采用圖像形式來間接實現(xiàn)。原因在網(wǎng)頁設(shè)計時是中文字體類型比較少，通用字體類型就更少了，字體的表現(xiàn)力比較弱，即使存在各種藝術(shù)字體，但是恐于藝術(shù)字體的應(yīng)用范圍窄，很少被設(shè)計師用來作為網(wǎng)頁字體使用。
CSS使用font-size屬性來定義字體大小，該屬性用法如下：
font-size : xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller | length
其中，xx-small（最?。?、x-small（較?。?、small（?。edium（正常）、large（大）、x-large（較大）、xx-large（最大）表示絕對字體尺寸，這些特殊值將根據(jù)對象字體進(jìn)行調(diào)整。
larger（增大）和smaller（減少）這對特殊值能夠根據(jù)父對象中字體尺寸進(jìn)行相對增大或者縮小處理，使用成比例的em單位進(jìn)行計算。
length可以是百分?jǐn)?shù)，或者浮點數(shù)字和單位標(biāo)識符組成的長度值，但不可為負(fù)值。其百分比取值是基于父對象中字體的尺寸來計算，與em單位計算相同。
【示例】啟動Dreamweaver，新建一個網(wǎng)頁，保存為test.html，在<body>標(biāo)簽中輸入以下內(nèi)容：
<div>
<p class="p1">明月幾時有？ 0.6in</p>
<p class="p2">明月幾時有？ 0.8em</p>
<p class="p3">明月幾時有？ 2cm</p>
<p class="p4">明月幾時有？ 16pt</p>
<p class="p5">明月幾時有？ 2pc<
/p></div>在<head>標(biāo)簽內(nèi)添加<style type="text/css">標(biāo)簽，定義一個內(nèi)部樣式表，然后輸入下面樣式，分別設(shè)置各個段落中的字體大小。div{font-size:20px;} /*以像素為單位設(shè)置div標(biāo)簽字體大小*/
.p1{ font-size: 0.6in; } /*以英寸為單位設(shè)置字體大小*/
.p2{ font-size: 0.8em; } /*以父級字體大小為參考設(shè)置大小*/
.p3{ font-size: 2cm ; } /*以厘米為單位設(shè)置字體大小*/
.p4{ font-size: 16pt; } /*以點為單位設(shè)置字體大小*/
.p5{ font-size: 2pc; } /*以皮卡為單位設(shè)置字體大小*/
當(dāng)前文章標(biāo)題：如何在網(wǎng)頁制作時使用CSS定義文本樣式（一）
當(dāng)前URL：http://51zuanshi.com.cn/news/wzzz/3062.html
