ccs3中icon转换为字体的方法
小图标转换为字体有几大优点
- 文件小,一般50k以内
- 避免了加载多个icons,减少了加载次数,有利于页面优化。
- 兼容性很好,可以随便放大缩小,都能正常显示。
- 维护起来也很简单,只用找到这个字体文件(比如.ttf文件),修改里面的某个图标即可。
制作方法
首先,用ps或直接用矢量图软件制作单个icon,制作好后保存为ttf格式,如图:
faq.ttf
然后,打开字体编辑器,比如FontCreator,新建字体myfonts。


需要添加一个字体,可以右击——>插入,然后“导入图像”,即做好的矢量图片(位图效果不好)。

对图像做相应的调整,直到合适为止。然后保存为myfont.ttf即做好了ttf字体文件。
字体格式转换
为了兼容不同的浏览器,需要制作不同的字体格式。比如IE只支持eot格式,便可以用格式转换工具,将ttf转换成其他格式。比如ttf-->eot在线转换:
http://ttf2eot.sebastiankippe.com/

ccs3中icon转换为字体的方法的更多相关文章
- 将java中数组转换为ArrayList的方法实例(包括ArrayList转数组)
方法一:使用Arrays.asList()方法 1 2 String[] asset = {"equity", "stocks", "gold&q ...
- js中字符串转换为数字的方法
parseInt; parseFload; +; parseInt() 和 parseFloat() 函数会尝试逐个解析字符串中的字符,直到遇上一个无法被解析成数字的字符,然后返回该字符前所有数字字符 ...
- Android 中使用自定义字体的方法
1.Android系统默认支持三种字体,分别为:“sans”, “serif”, “monospace 2.在Android中可以引入其他字体 . <?xml version="1.0 ...
- js中字符串转换为数值的两种方法的区别
在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt() //将字符串转换为整型 parseFloat() //将字符串转换为浮点型 转换函数在 ...
- JAVA中3种将byte转换为String的方法
HttpClient 类库中GetMethod类的getResponseBody方法返回的是byte[]类型,要操作起来不方便,我想把它转化成String类型. 查了网上的资料,有说法认为用这种方法比 ...
- CSS3的自定义字体@font-face:将图片ICON转为字体
大家都知道现在各个浏览器都支持CSS3的自定义字体(@font-face),包括IE6都支持,只是各自对字体文件格式的支持不太一样.那么对于网站中用到的各种icon,我们就可以尝试使用font来实现, ...
- JavaScript -- 时光流逝(三):js中的 String 对象的方法
JavaScript -- 知识点回顾篇(三):js中的 String 对象的方法 (1) anchor(): 创建 HTML 锚. <script type="text/javasc ...
- Axure中移动端原型设计方法(附IPhoneX和IPhone8最新模板)
Axure中移动端原型设计方法(附IPhoneX和IPhone8最新模板) 2018年4月16日luodonggan Axure中基于设备模板的移动端原型设计方法(附IPhoneX和IPhone8最新 ...
- XML序列化 判断是否是手机 字符操作普通帮助类 验证数据帮助类 IO帮助类 c# Lambda操作类封装 C# -- 使用反射(Reflect)获取dll文件中的类型并调用方法 C# -- 文件的压缩与解压(GZipStream)
XML序列化 #region 序列化 /// <summary> /// XML序列化 /// </summary> /// <param name="ob ...
随机推荐
- CodeForces 716B Complete the Word
题目链接:http://codeforces.com/problemset/problem/716/B 题目大意: 给出一个字符串,判断其是否存在一个子串(满足:包含26个英文字母且不重复,字串中有‘ ...
- 面向对象编程OOP-1
在下面的例子中, 我们定义了 Student类作为 Person类的子类. 之后我们重定义了sayHello() 方法并添加了 sayGoodBye() 方法 // 定义Person构造器 funct ...
- thikphp创建共享数据config.php
要求:前台,后台:只需要配置一个config.php 其他文件共享 默认配置是 Index/Conf/config.php Admin/Conf/config.php 代码: return array ...
- [asp.net core]project.json(2)
摘要 上篇文章介绍了project.json中的一部分属性.属性真的比较多,所以分开了,考虑到其中的英文比较简单,也不再进行翻译了,从英文原文中,直接粘贴过来了. project.json(1) pr ...
- webapi支持跨域访问
写在前面 在实际应用中,跨域请求还是比较常见的,如何上接口直接支持跨域的访问呢? demo 场景项目A有个接口用来获取用户列表,现在项目b也有个功能需要加载用户列表.这两个项目在两个域名下,至少端口好 ...
- Kafka入门经典教程
本帖最后由 desehawk 于 2015-5-3 00:45 编辑问题导读 1.Kafka独特设计在什么地方?2.Kafka如何搭建及创建topic.发送消息.消费消息?3.如何书写Kafka程 ...
- 【11-23】window常用知识
tips msconfig :管理应用程序加载启动项,也可以通过我的计算机查看 service.msc :管理windows本地服务 命令行:net start :显示所有启动的服务,不加分号 net ...
- hdu5024 Wang Xifeng's Little Plot (水
http://acm.hdu.edu.cn/showproblem.php?pid=5024 网络赛 Wang Xifeng's Little Plot Time Limit: 2000/1000 M ...
- HighCharts选项和参数详细配置查询表
概述:作为一款出色的交互图表制作工具,HighCharts有着全面的选项.参数等配置信息.为了帮助大家进一步掌握HighCharts,今天我们为大家整理了HighCharts的所有配置信息和说明,将其 ...
- JCarouselLite--帮助文档
jcarousellite是一款jquery插件,可以控制文档元素滚动,丰富的参数设置可以控制滚动的更多细节,是一款不可多得的滚动插件. ------------------ 官网地址:http:// ...