FONT Google Fonts 網路中文/英文字型應用

開啟Google Fonts: Early Access 頁面，找到Noto Sans TC（Chinese Traditional），就能看到網站提供的程式碼，使用方法很簡單，只要把Google Fonts 提供的那段CSS 程式碼 ... 網頁設計筆記 WebDesign 首頁/網頁設計講義 FONTGoogleFonts網路中文/英文字型應用 GoogleFonts網路中文字型 Googlefonts思源黑體 Googlefonts圓體 Googlefonts仿宋體 Googlefonts明體 Googlefonts楷體 GoogleFonts網路英文字型 WebFonts參考文獻 GoogleFonts網路中文字型 GoogleFontshttps://fonts.google.com Google推出5款免費的中文網頁字型 cwTeXKai(ChineseTraditional)楷體字體 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexkai.css); font-family:"cwTeXKai",serif; cwTeXYen(ChineseTraditional)圓體字體 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexyen.css); font-family:"cwTeXYen",sans-serif; cwTeXFangSong(ChineseTraditional)仿宋體字體 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexfangsong.css); font-family:"cwTeXFangSong",serif; NotoSansTC(ChineseTraditional)黑體字體（思源黑體） @importurl(https://fonts.googleapis.com/earlyaccess/notosanstc.css); font-family:"NotoSansTC",sans-serif; cwTeXMing(ChineseTraditional)明體字體 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexming.css); font-family:"cwTeXMing",serif; 雲端字體下載網址：https://fonts.google.com/earlyaccess 目前可以在網頁上使用這些中文網路字型。

以下為大家介紹如何使用這些Google推出的中文網路字型。

使用英文字體的方式也一樣，選擇喜歡的字體，試試看效果如何。

使用Googlefonts黑體｜NotoSans思源黑體(正式版) 思源黑體是Adobe和Google共同開發的開放原始碼字型，發佈時就已支援繁體中文、簡體中文、日文及韓文，因此深受許多使用者喜愛。

GoogleFonts本身不會對流量或次數額度有所限制，且無須註冊或下載檔案，只要依照服務提供的字型CSS程式碼，套入自己的網站後稍作調整即可使用，非常簡單！ 網站名稱：GoogleFonts:EarlyAccess 網站鏈結：https://fonts.google.com/earlyaccess 開啟GoogleFonts:EarlyAccess頁面，找到NotoSansTC（ChineseTraditional），就能看到網站提供的程式碼，使用方法很簡單，只要把GoogleFonts提供的那段CSS程式碼放入網站的＜head＞，或style.css檔案中，修改CSS來加入「NotoSansTC」就能載入網頁字型。

Googlefonts：NotoSansTC(ChineseTraditional)黑體（思源黑體） @importurl("https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap"); font-family:'NotoSansTC',sans-serif; 正式版字體引入網址的最後面加上了display=swap，這是讓字型遇到網路比較慢的狀況未能即時下載時，可以先顯示內建的字體，不至於讓網站有空白的空窗期。

使用Googlefonts圓體字型 Googlefonts：cwTeXYen(ChineseTraditional)圓體字型 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexyen.css); font-family:"cwTeXYen",sans-serif; 使用Googlefonts仿宋體 Googlefonts：cwTeXFangSong(ChineseTraditional)仿宋體字型 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexfangsong.css); font-family:"cwTeXFangSong",serif; 使用Googlefonts明體｜NotoSans思源宋體(正式版) Googlefonts：NotoSerifTC(ChineseTraditional)NotoSans思源宋體(正式版) @importurl(https://fonts.googleapis.com/css?family=Noto+Serif+TC&display=swap"); font-family:'NotoSerifTC',serif; 使用Googlefonts楷體 cwTeXKai(ChineseTraditional)楷體字體 @importurl(https://fonts.googleapis.com/earlyaccess/cwtexkai.css); font-family:"cwTeXKai",serif; GoogleFonts網路英文字型 GoogleFonts｜Google網頁字型https://fonts.google.com Google網頁字型列表，可選擇任一字體進入觀看 將想使用的字體加入字體選項，右邊出現語法連結，將之替換font-family選項。

或者進入雲端字體下載網址：https://fonts.google.com/earlyaccess 可直接選擇替換字體選項 WebFonts參考文獻 做出高質感網站，必須知道的網頁字體應用 網頁設計中最常用的字體有哪些？ 網頁字型指南：了解英文字型3大類，讓你的網站更專業！