字体文件使用及压缩

ⅰ亾dé卋堺 提交于 2019-12-05 04:34:48

字蛛链接:附:http://font-spider.org/

1.字体文件可以获取任意一类,然后去网站生成兼容不同浏览器的文件。一般情况下,在网上能搜到字体的类型文件:ttf。

https://www.fontke.com/tool/convfont/?fromlang=zh_CN

2.字体文件太大,一般选择用字蛛去压缩字体文件。

安装命令:

npm install font-spider -g

在 CSS 中使用 WebFont:

/*声明 WebFont*/
@font-face {
  font-family: 'pinghei';
  src: url('../font/pinghei.eot');
  src:
    url('../font/pinghei.eot?#font-spider') format('embedded-opentype'),
    url('../font/pinghei.woff') format('woff'),
    url('../font/pinghei.ttf') format('truetype'),
    url('../font/pinghei.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*使用选择器指定字体*/
.home h1, .demo > .test {
    font-family: 'pinghei';
}

1. @font-face 中的 src 定义的 .ttf 文件必须存在,其余的格式将由工具自动生成

2. 开发阶段请使用相对路径的 CSS 与 WebFont

运行:

font-spider ./demo/*.html使用注意:文件目录这样创建:

 

 
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!