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