pCloud Partner Program

好用Google中文字體

程式技術 2016/10/12 11:07
views: 70167 times
製作網站時, 前端的中文字體真的是很傷腦筋, 又沒有那麼多的選擇, 又需要考慮使用者端是否有對應的字型. Google Font 計畫提供了許多字型可供應用, 也有不少繁體字型可供應用.

先來看看有哪些吧:

https://fonts.google.com/earlyaccess

上面是目前所有新增的 Google Font 的字體(非英文與拉丁文為主的), 我們可以用 Chinese 來查看看有哪些:

楷體 cwtexkai
圓體 cwtexyen
仿宋體 cwtexfangsong
Noto Sans TC notosanstc
明體 cwtexming
黑體 cwtexhei

這6種字體可供應用, 使用方式也很簡單, 直接使用對應的 CSS 即可, 以楷體為例, 可以看到他的 CSS 引入語法如下:

@import url(http://fonts.googleapis.com/earlyaccess/cwtexkai.css);

之後只需要在對應的 class 下 font-family 語法即可, 如下:

font-family: 'cwTeXKai', serif;

為方便一次檢視所有字體, 可以參考範例資料:

http://sample.diary.tw/42/index.htm

繼續閱讀:
http://www.ithome.com.tw/news/108941

top

如何從外部載入網頁上使用的字型

程式技術 2011/04/25 16:11
views: 62944 times
這個其實很久以前的 CSS 就支援了. 這是一個利用 CSS 指令的方式來設定外部字型, 使用的方式如下:



如此一來, 便能在 html 中使用指定的字型了. 不過這個方式使用在英文字型比較理想, 若是中文字型的話, 還得等待用戶下載一個超大的字型檔(中文字小則4~5MB, 大則 20MB都有), 光等待下載的時間可能就讓用戶受不了了.

網路上可以找到不少免費的中英文字型, 利用這樣的方式, 可以更方便地更換網頁上的字型, 讓字型的應用更彈性, 不過中文還真的沒有什麼好方法可以解決.

相關閱讀:
http://blog.bobchao.net/2009/06/35-4b-font-face.html

免費字型:
http://isvincent.pixnet.net/blog/post/31012343
http://www.freegroup.org/2009/09/free-chinese-fonts-hdzb/
http://briian.com/?p=290
top




Nextbit Robin 5.2吋六核心智慧型手機 Microsoft Office 365 中文家用版PKC (無光碟)
ASUS華碩 AC1900 雙頻無線路由器 RT-AC68U 美國 VORNADO 533 渦流空氣循環機 (黑色)
御茶園 每朝健康綠茶(650mlx24入) 每朝健康 雙纖綠茶(650mlx24入)


 Waiting...