分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

在网页中使用特殊中文字体成为可能

发布时间:2023-09-06 01:54责任编辑:赖小花关键词:暂无标签

转载 http://www.cnblogs.com/Kummy/p/4442142.html
??以前还不知道这种办法的时候,如果要在网页中显示特殊中文字体的话,需要导入整个全部的.ttf字体文件,而文件高达好几兆,根本是不可取的,偶然间看到以上链接的文章,新的思路新的方法,将网页中需要用特殊字体的中文文字,进行打包压缩。

1.安装font-spider

npm install font-spider -g

2.在css中使用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;} // 指定字体并使用.pinghei { ???font-family: ‘pinghei‘;}// ../font 都是相对路径,看文件相对位置// 其中.ttf文件是必须要有的,根据设计稿的字体在网上下载对应的.ttf文件,其他都是生成的

3.运行font-spider命令

font-spider *.html

4.温馨提示

运行font-spider命令后,会自动生成相关文件,而其中的字体只包括只包括只包括页面中出现并引用字体的文字,如果后面新增了其他文字,需要重新运行命令

在网页中使用特殊中文字体成为可能

原文地址:https://www.cnblogs.com/shenmissing/p/9037288.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved