鍍金池/ 問(wèn)答/HTML/ 前端如何處理psd設(shè)計(jì)稿中文字使用的PingFangSC字體?

前端如何處理psd設(shè)計(jì)稿中文字使用的PingFangSC字體?

拿到的設(shè)計(jì)稿中文字都用的是PingFangSC。把通用的font-family改成這樣

font-family: "PingFang SC", "Helvetica Neue", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", "Hiragino Sans GB", "Source Han Sans CN Normal", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp", sans-serif;

讓頁(yè)面在mac上優(yōu)先使用PingFang SC字體,window上用微軟雅黑
標(biāo)題使用的是PingFangSC medium,詳細(xì)介紹文字用的是PingFangSC light。

window電腦沒(méi)有這種字體,標(biāo)題的PingFangSC medium用的是 微軟雅黑bold 看起來(lái)會(huì)有些大?
不用又和介紹文字沒(méi)什么區(qū)別。
mac上使用的是PingFang SC 和 PingFangSC medium,PingFangSC light 看起來(lái)又有些區(qū)別?
不知道各位前輩有沒(méi)有遇到過(guò)這樣難受的問(wèn)題?

回答
編輯回答
眼雜

@font-face

fontmin-字體子集化方案

2018年6月19日 02:11
編輯回答
只愛(ài)你

不光是版權(quán)的問(wèn)題,你裝到服務(wù)器,客戶打開(kāi)頁(yè)面的時(shí)候要加載字體,小的還可以,大的加載半天。還是做成圖片吧

2017年7月21日 10:04
編輯回答
紓惘

中文字體包一般都會(huì)很大,放到服務(wù)器上再取下來(lái)效率很差,而且會(huì)出現(xiàn)頁(yè)面抖動(dòng)的問(wèn)題,就是剛加載進(jìn)來(lái)的時(shí)候是瀏覽器默認(rèn)本身有的字體,整個(gè)字體文件下載下來(lái)后文字會(huì)被重新渲染,在這期間頁(yè)面會(huì)出現(xiàn)抖動(dòng)的現(xiàn)象,建議你就保留你現(xiàn)在的自己設(shè)置,如果用戶的電腦本身有這個(gè)字體,那就取他系統(tǒng)里面的字體去渲染,沒(méi)有的話取替代的字體。
如果字不經(jīng)常換建議用圖片,如果使用圖片并且還是響應(yīng)式頁(yè)面的話,需要調(diào)整文字的大小,適配 PPI 的話,建議使用 SVG 圖片格式。

2017年10月23日 12:20
編輯回答
墨染殤

叫UI改~?。?!
哈哈開(kāi)玩笑的,UI妹子是用來(lái)心疼的?。?!
哈哈還是開(kāi)玩笑的??!
。。。。
如果非要效果一致(這不是廢話?。?,那就下載字體到服務(wù)器,然后再應(yīng)用,但是似乎蘋(píng)果的冬青黑字體是有版權(quán)的(未驗(yàn)證)。
不然就同一字體吧,其實(shí)有一些別的字體也很好看啊,像roboto什么的,可以考慮試試。
再者,如果標(biāo)題不是經(jīng)常換的,那也考慮切圖。

2018年5月17日 12:09
編輯回答
負(fù)我心

我一般只寫(xiě) "Helvetica Neue", Helvetica, Arial 這三個(gè)

如果有必要的話 就引入web字體

2018年4月19日 02:00
編輯回答
撿肥皂

沒(méi)有字體庫(kù)的話,就自己下載字體,上傳到服務(wù)器,再在font-family里面引用就可以了
@font-face{

font-family:微軟雅黑;
font-style:normal;
src:url(../dis_fun/line.ttf);

}

2017年3月6日 18:33
編輯回答
北城荒

系統(tǒng)自帶字體,寫(xiě)在font-family里是沒(méi)問(wèn)題的,但如果放服務(wù)器上,不管是原字體文件還是裁切過(guò)的或者是轉(zhuǎn)圖轉(zhuǎn)曲,原則上都會(huì)有版權(quán)問(wèn)題,只是版權(quán)方追不追究的問(wèn)題了。前端除以上提到的以外,最多是多適配幾種相似字體,比如可以考慮下前段時(shí)間比較火的思源(話說(shuō)干嘛不用思源?沒(méi)記錯(cuò)的話不限商用吧)

2017年11月13日 11:02
編輯回答
故林

遇到這種問(wèn)題一般我都直接切成圖片來(lái)搞,如果沒(méi)有辦法切圖片的話,那就下載這個(gè)字體,傳到服務(wù)器上去,然后再引用

2018年7月25日 06:10
編輯回答
夢(mèng)囈

那玩意是蘋(píng)果系統(tǒng)的字體,粗中細(xì)三種引入要50多M。放棄吧

2017年12月2日 22:15