HTML font face 網頁文字的字型設定

HTML 的font face 屬性的參數＂字型名稱＂可以用來設定想要的字型，並直接套用在font 標籤所包含的文字範圍內，每一次都只能套用一個字型，這裡要注意的是被套用字型必須是 ... WEBTECH網頁設計教學站 首頁 PHP CSS HTML JavaScript GIMP Linux OpenOffice 瀏覽器 其它 Home › HTML › HTMLfontface網頁文字的字型設定 HTMLfontface網頁文字的字型設定 HTMLfontface網頁文字的字型設定是傳統的字型設計方式，這裡所謂的字型設計並非指設計出一套字型，而是套用現成的字型至指定的文字上，嚴格來說face是font的一個屬性，網頁設計師可以利用fontface屬性讓文字呈現出serif字型、sans-serif字型、新細明體、標楷體、微軟正黑體...等不同的字型，搭配整體網頁設計的風格。

HTMLfontface語法網頁文字HTML的fontface屬性的參數＂字型名稱＂可以用來設定想要的字型，並直接套用在font標籤所包含的文字範圍內，每一次都只能套用一個字型，這裡要注意的是被套用字型必須是瀏覽者的電腦可以顯示的字型，例如Windows系列的電腦可能會有新細明體、微軟正黑體、標楷體這些字型，可是iOS、Android、Linux這些作業系統不一定會有這些字型，但普遍都會有通用字型，常見的face通用字型有serif、sans-serif、cursive、fantasy、monospace這些，請看範例的實際操作效果。

HTMLfontface範例這是serif字型的效果
這是sans-serif字型的效果
這是cursive字型的效果
這是fantasy字型的效果
這是monospace字型的效果
這是微軟正黑體字型的效果
這是標楷體字型的效果
這是新細明體字型的效果範例輸出效果這是serif字型的效果這是sans-serif字型的效果這是cursive字型的效果這是fantasy字型的效果這是monospace字型的效果這是微軟正黑體字型的效果這是標楷體字型的效果這是新細明體字型的效果範例所呈現的是使用HTMLfontface屬性將各種常見字型套用至網頁文字中的結果，每個字型的效果有些許差異，不過並非所有的字型都可以順利顯示，主要還是看瀏覽者的電腦是否能夠顯示所設定的字型，雖然這些字型透過HTMLfontface屬性可以很輕易的套用到網頁文字中，不過缺點是一次僅能套用一個字型，選擇太少代表風險提高，新一代的網頁字型設計通常採用CSS來做，優點是可以一次預設好幾的不同字型預排，請參閱：CSSfont-family屬性研究，設定你的文字。

更多網頁字型設計HTMLfont粗體字設計HTMLfontstyle文字樣式設計HTMLfontsize網頁文字大小設計HTMLfontcolor文字顏色設計 您可能會想看 HTMLspan標籤用法 如何修改HTMLDIV區塊內的文字字型 如何替HTMLDIV增加背景顏色 HTMLDIV標籤用法 設計具有超連結效果的HTMLolli自動排序項目清單 設計具有超連結效果的HTMLulli項目清單 HTMLolli列表(數字編號項目清單) HTMLulli列表(項目清單) HTMLtextarea表單多行文字輸入欄位背景圖片設計 HTMLtextarea表單多行文字輸入欄位背景顏色設計 即時熱門文章 如何替HTMLDIV區塊增加邊框效果 如何在HTMLDIV區塊內插入圖片 如何修改HTMLDIV區塊內的文字顏色 HTMLspan標籤用法 如何修改HTMLDIV區塊內的文字字型 如何替HTMLDIV增加背景顏色 HTMLDIV標籤用法 PHPstripslashes函數 PHPstrip_tags函數消除PHP或HTML標籤符號 PHPaddslashes函數替字符增加斜線 今日熱門文章 如何替HTMLDIV區塊增加邊框效果 如何在HTMLDIV區塊內插入圖片 如何修改HTMLDIV區塊內的文字顏色 HTMLspan標籤用法 如何修改HTMLDIV區塊內的文字字型 如何替HTMLDIV增加背景顏色 HTMLDIV標籤用法 PHPstripslashes函數 PHPstrip_tags函數消除PHP或HTML標籤符號 PHPaddslashes函數替字符增加斜線 ©Copyrightwebtech.twSince2010