CSS3 关于@font-face引用中文字体解决办法
有两种方法,一种简单的,一种比较复杂,都可以实现(注:这里的方法只适合使用少量的中文字体,如果使用的字量过大,请使用其他方法解决)
第一种:简单的
1.下载需要的中文字体的.ttf格式,这个都不难找到,百度上一搜一大片,都可以下载到。
2.下载fontforge软件,这个软件可以编辑字体,字体文件内存一般都比较大,直接使用会导致网速加载速度变慢,使用这个字体编辑软件的目的就是将需要的字体提取出来,可以解决字体内存变小,从而不影响加载速度。
3.打开AI,写一个自己需要的文字,如图,我这里使用的方正姚体,将写好的字体转化成轮廓(在字体上单机右键—>创建轮廓),然后将文字保存成.svg格式。
4.打开下载好的fontforge软件,新建一个新的空白字体文件,查看过@font-face引用字体源文件的同学应该知道,字体或者icon在代码中引用都是用符号代替的,也就是这边字体符号,新建的字体文件中建议从A开始做字体,这样方便后期代码中书写,双击A下面的框,弹出一个字体编辑窗口,点击File—>Import,导入刚才用AI保存的.svg格式文件,导入字体。(注:选择导入字体类型)
导入字体成功
如上方法将需要的字体全部导入后保存成.ttf格式(点击File—>Generate Fonts)。(注:1.这里要保存成.ttf格式,如下图;2.编辑好的字体建议截图保存,方便后期文字修改查找所对应的字符)
编辑字体的工作到这里就结束了。
5.使用fontsquirrel在线转换软件将.ttf格式转换成需要的格式.eot .woff .svg .ttf等页面中所需要的格式。(注:fontsquirrel在线转换软件网址:http://www.fontsquirrel.com/tools/webfont-generator),转换完成保存压缩包到需要的文件下,这里文件包会自动生成一个stylesheet.css文件,文件中已经将字体引用好了,直接使用即可。
第二种:复杂的
1.将下载好的.ttf文件用fontforge字体编辑软件打开,在fontforge中新建一个空白字体文件,将打开的.ttf中所需要的文字双击打开编辑窗口,点击File—>Export将字体导出成.svg格式。在空白字体文件中,双击A下面的框,弹出字体编辑窗口,点击File—>Import将字体导入的文件中,在这里寻找自己需要的文字可能会费大量的时间。(注:这里不能从.ttf文件中直接拷贝字体到新建空白字体文件中,这样字体会变小,建议先导出,再导入)。
2.如上方法,将需要的字体重新编排在新建的文件中再保存成.ttf格式,会使字体文件的内存变小,方便使用。
3..ttf字体文件转换其他格式的方法请查看第一种方法步骤5。
两种方法都可以实现中文字体转换,使用@font-face方法和英文字体引用方式一样。
CSS3 关于@font-face引用中文字体解决办法的更多相关文章
- QT程序中显示中文字体解决办法
Qt4.7.1 默认没有中文字体库,迅为给用户提供“文泉驿”字体和配置方法.本节需要的 文件在网盘: 用一个简单测试程序说明“文泉驿”字体的配置方法. 在 Qt Creater 新建工程“nihao” ...
- html网页引用中文字体,解决加载缓慢办法
[ttf 压缩]html网页引用中文字体,文件过大,加载缓慢的解决办法[字蛛][web font] [字蛛]http://font-spider.org/ 先安装好 NodeJS,然后执行: npm ...
- mac中matplotlib不支持中文的解决办法
参考:https://blog.csdn.net/kaizei_pao/article/details/80795377 首先查看matplotlib已加载的字体: import matplotlib ...
- NetBeans中文乱码解决办法
一.Windows下NetBeans中文乱码解决办法 找到你的Netbeans安装目录下的etc文件夹,用记事本打开netbeans.conf,找到netbeans_default_options(不 ...
- [Linux] - CentOS中文乱码解决办法
CentOS 7 终端中文乱码解决办法: 1.使用vim编辑locale.config文件: vim /etc/locale.conf 2.将LANG="en_US.UTF-8"修 ...
- Oracle导入中文乱码解决办法
Oracle导入中文乱码解决办法 一.确保各个客户端字符集的编码同服务器字符集编码一致 1- 确定sqlplus字符集编码,如果是windows设置环境变量. 2- 确保Sec ...
- 几个常用的CSS3样式代码以及不兼容的解决办法
原文:几个常用的CSS3样式代码以及不兼容的解决办法 border-radius实现圆角效果 CSS3代码: -webkit-border-radius:10px; -moz-border-radiu ...
- centos7.2中文乱码解决办法
centos7.2 中文乱码解决办法 1.查看安装中文包: 查看系统是否安装中文语言包 (列出所有可用的公共语言环境的名称,包含有zh_CN) # locale -a |grep "zh_C ...
- windows下git bash中文乱码解决办法
一.解决办法1:(直接上图) 1.在git bash下,右键 出现下图,选择options: 2.选择“Text” 3.将“Character set”设置为 UTF-8 转:windows下git ...
随机推荐
- 微软雅黑字体IE6 opacity改变,字体会变样子
微软雅黑字体IE6 opacity改变,字体会变样子,换个字体就好了
- 信号之system函数
在http://www.cnblogs.com/nufangrensheng/p/3512291.html中已经有了一个system函数的实现,但是该版本并不执行任何信号处理.POSIX.1要求sys ...
- LINUX怎么远程连接ORACLE数据库
A电脑装了ORACLE客户端,B是ORACLE服务器,都在LINUX环境下,请问A电脑怎么访问B上的数据库?该怎么改配置?求高手解答,越详细越好 很简单,你在A电脑安装一个ORACLE 客户端,然后, ...
- ES 中的那些坑
数组 1. 数组中的 full-text 字段将被 [analyzed] 2. 数组中[所有元素]的数据类型必须一致 3. 数组的数据类型,以其 [第一个元素]为准 映射 1. 数据类型会自动进行转化 ...
- PHP之ThinkPHP数据操作CURD
两个数据表 具体操作如下: /**********************数据库操作********************/ ////////添加数据////////// ...
- 关于快速排序的Java代码实现
快速排序(Quicksort)是对冒泡排序的一种改进.它的基本思想是:通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别 ...
- MATLAB的循环结构
循环结构有两种基本形式:while 循环和for 循环.两者之间的最大不同在于代码的重复是如何控制的.在while 循环中,代码的重复的次数是不能确定的,只要满足用户定义的条件,重复就进行下去.相对地 ...
- Centos 6.4 安装elasticsearch+kibana
elasticsearch和kibanna的链接地址:https://www.elastic.co/downloads,我的环境里用的包为kibana-4.1.1-linux-x64.tar.gz和e ...
- Python(2.7.6) 标准日志模块 - Logging Handler
Python 标准日志模块使用 Handler 控制日志消息写到不同的目的地,如文件.流.邮件.socket 等.除了StreamHandler. FileHandler 和 NullHandler ...
- [LaTex]Visio文件转EPS文件[转]
在LaTeX系统中,由于DVI 文件经常被转为PostScript 文件,所以LATEX 支持最好的是EPS 格式(Encapsulated Post-Script ,是PostScript 语言的子 ...