中文字體引用及壓縮

中文字體引用(如思源雅黑)html

第一步: 網站下載字體: http://www.downcc.com/font/326030.htmlnode

第二步:百度  @font-face生成器   (字客網 https://www.fontke.com/tool/fontface/   生成不一樣格式和字體和樣式,頁面引用便可)web

解決chrome瀏覽器下@font-face字體圖標出現鋸齒:chrome

要注意不一樣格式字體引用順序問題 》 eot>svg>ttf>woff2>woffnpm

@font-face {
  font-family: "SourceHanSansCN-Regular";
  src: url("font/SourceHanSansCN-Regular.eot") format("embedded-opentype"),
      url("font/SourceHanSansCN-Regular.svg") format("svg"),
       url("font/SourceHanSansCN-Regular.ttf") format("truetype"),
        url("font/SourceHanSansCN-Regular.woff2") format("woff2"),
       url("font/SourceHanSansCN-Regular.woff") format("woff") ;
  font-weight: normal;
  font-style: normal;
}

*{font-family:'SourceHanSansCN-Regular',Arial, Helvetica, sans-serif;  -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-text-size-adjust:none; }

 https://www.cnblogs.com/Jm-jing/articles/6978830.html瀏覽器

字蛛是一箇中文字體壓縮器

http://font-spider.org/#use

安裝node.js 再打開Node.js command prompt 測試 node -v 有版本號出來即成功;
而後再運行: npm install font-spider -g
ide


node.js出錯緣由: svg

1. 要用Node.js command prompt 運行
2. 字體引用時必須用英文單引號
{
@font-face {
font-family:'SourceHanSansCN-Medium';
src:url('../font/SourceHanSansCN-Medium.eot');
src: url('../font/SourceHanSansCN-Medium.eot?#font-spider') format('embedded-opentype'),
url('../font/SourceHanSansCN-Medium.svg') format('svg'),
url('../font/SourceHanSansCN-Medium.ttf') format('truetype'),
url('../font/SourceHanSansCN-Medium.woff2') format('woff2'),
url('font/SourceHanSansCN-Medium.woff') format('woff');
font-weight: normal;
font-style: normal;
}
}測試

3. 不用引用圖標字體;字體

4. 再運行 font-spider G:/work/氚雲/web/*.html

相關文章
相關標籤/搜索