網頁中的中文標楷體有方法可以顯示在行動裝置嗎?

html css

mayyola 2019-02-13 12:59:21 ‧ 5886 瀏覽

各位大大好:

我用html編輯網頁，將CSS代入<link rel="stylesheet" type="text/css" href="style.css" />，在CSS有寫到body,input {font-family: DFKai-sb;}
在桌機可以顯示中文標楷體，想請問手機或ipad的瀏覽器是否有方法也可以顯示標楷體呢?
謝謝

窮嘶發發發 iT邦高手 1 級 ‧ 2019-02-13 13:56:47 檢舉

https://wpbox.tips/google-fonts-chinese-traditional/

淺水員 iT邦大師 6 級 ‧ 2019-02-13 18:50:37 檢舉

除了技術層面外，還請注意授權的問題，印象中標楷體要另外取得授權。

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

㊣浩瀚星空㊣

iT邦大神 1 級 ‧ 2019-02-13 17:06:03

你需要指定外部使用字型的應用才行。
比較常用的就是google的字型。

窮嘶發發發大已經有提供給你相關的資料了，我就不在另行提供。

另外一種方式就是自行下載字型檔回來放在你的server上。再運用css的implort的方式，來達到你要的字型顯示。(你可以自行下載google的css回來參考)

回應 4
分享
檢舉

看更多先前的回應...收起先前的回應...

mayyola iT邦研究生 2 級 ‧ 2019-02-14 21:39:17 檢舉

Google fonts – cwTeXKai (Chinese Traditional) 楷體字體
y大您好:我沒有自行下載自型，我有把這放入css中,但不能用..
不知道哪裡有錯..


@import url(https://fonts.googleapis.com/earlyaccess/cwtexkai.css);
font-family: 'cwTeXKai', serif;

㊣浩瀚星空㊣ iT邦大神 1 級 ‧ 2019-02-15 16:30:47 檢舉

從你的css來看。看不到你的body定義。
你可以po一下你完整的css嘛??
正常因該要

@import url(https://fonts.googleapis.com/earlyaccess/cwtexkai.css);
body{
  font-family: 'cwTeXKai', serif;
}

mayyola iT邦研究生 2 級 ‧ 2019-02-15 16:47:28 檢舉

一下可以一下不行..，但手機還是不行..
不過jsfiddle再手機上看卻可以看到標楷體..
http://jsfiddle.net/27ujnx43/

mayyola iT邦研究生 2 級 ‧ 2019-02-17 00:02:40 檢舉

謝謝大家，已解決
加了以下語法
@font-face {
font-family: 'cwTeXKai';
src: url('webfont.eot'); /* IE9 Compat Modes /
src: url('webfont.eot?#iefix') format('embedded-opentype'), / IE6-IE8 /
url('webfont.woff2') format('woff2'), / Super Modern Browsers /
url('webfont.woff') format('woff'), / Pretty Modern Browsers /
url('webfont.ttf') format('truetype'), / Safari, Android, iOS /
url('webfont.svg#svgFontName') format('svg'); / Legacy iOS */
}