inconfont 字体库应用
先去注册个号码,好像只可以用新浪微博登录哈,搞一个微博去。
第一就是点上面图标库,选择官方和所有都行。
恩接着点一个图标,他就自己跑到 第二个按钮哪里去了,在点第二个按钮,会出来一个创建项目,随便创建一个就好。
上图不说话
下载本地这个 大家都会把我就不解释了哈,别问我 怎么不和照片一样,我之前就给那个项目里面加了好几个图标,你的只有一个图标是正确的。
恩然后就得到了这么多文件,然而我们只要我红色框里面圈到的文件就好
现在我们把 我们要得到的东西都得到了,然后就是 你自己写html了:
第一步:使用font-face声明字体
@font-face {
font-family: 'iconfont';
src: url('iconfont.eot'); /* IE9*/
src: url('iconfont.eot') format('embedded-opentype'), /* IE6-IE8 */
url('iconfont.woff') format('woff'), /* chrome、firefox */
url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url('iconfont.svg') format('svg'); /* iOS 4.1- */
}
第二步:定义使用iconfont的样式
.iconfont{
font-family:"iconfont" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
第三步:挑选相应图标并获取字体编码,应用于页面
<i class="iconfont">3</i>
第一步那些代码全部复制粘贴到你的css文件,嗯嗯,上面说到 要的那四个文件 你找一个地方存着,看后缀eot和woff和ttf和svg后缀的,对于上面的吧路径弄对,弄就是搞的意思。然后把第二部全部也复制在css里面,那个 .inconfont 那个class名字,你给你的i标签class用什么名字第二部就用什么名字。当然在第二部那个inconfont里面也可以加color颜色啊,font-size改变大小啊 都可以的哈。第三部i标签里面放的那个代码就是第四张图 下面的那个代码,那个代码就能出来图标 恩 OK了,完美不,快大声喊完美
inconfont 字体库应用的更多相关文章
- 如何给CentOS安装字体库
很多时候,我们需要做一些图像生成工作(譬如验证码之类的),这时候,我们一般都需要用到系统的字体库.但事情却总非尽善人意,我们所使用的Linux操作系统无法像Windows操作系统那样足够“旗舰”,字体 ...
- centos7.0 安装字体库
最近在centos7.0下用itextpdf将word文档转成pdf时出现字体丢失的情况.网上找了很多资料,各式各样的原因和解决方法.后来经过一番测试发现是centos7.0 minimal没有安装相 ...
- CentOS 7 安装字体库 & 中文字体
前言 报表中发现有中文乱码和中文字体不整齐(重叠)的情况,首先考虑的就是操作系统是否有中文字体,在CentOS 7中发现输入命令查看字体列表是提示命令无效: 如上图可以看出,不仅没有中文字体,连字体 ...
- CSS在线字体库,外部字体的引用方法
目录: 1:CSS家族五大字体 2:360和谷歌外部字体引用方法 3:谷歌外部字体引用方法详解 4:@font-face用法详解 一: {font-family:serif,sans-serif,fa ...
- 【转】cocos2d-x使用第三方的TTF字体库
步骤一:找一个ttf字体库 步骤二:找到这个ttf字体库的真实名称 打开你的应用 "字体册"(MAC OS系统下),如下图操作): 找到了字体库真实名称,那么修改将其真名作为为此新 ...
- IOS添加自定义字体库
1.将需要的字体库xxx.ttf添加到工程中,注意一定要在copy bundle resources中存在,如果没有添加上去 2.在info.plist 文件中添加 fonts provided by ...
- Android 使用图标字体库
首先,在assets资源文件下放入图标字体库. 我这儿采用的是fontawesome-webfont.ttf 然后, 在安卓中加载这个资源文件 Typeface fontFace = Typeface ...
- Xcode如何添加字体库--
1.网上搜索字体文件(后缀名为.ttf,或.odf) 2.把字体库导入到工程的resouce中 3.在程序viewdidload中加载一下一段代码 NSArray *familyNames = [UI ...
- Cocos2d-x教程(28)-ttf 字体库的使用
欢迎增加 Cocos2d-x 交流群: 193411763 转载请注明原文出处:http://blog.csdn.net/u012945598/article/details/37650843 通常为 ...
随机推荐
- whl文件安装
进入whl文件的目录,直接pip install ...即可
- UVA232字符串处理
#include <iostream> #include <cstdio> #include <algorithm> #include <cstring> ...
- 关于转换大写中文金额-新学的java函数整理
toCharArray public char[] toCharArray() 将此字符串转换为一个新的字符数组. 返回: 一个新分配的字符数组,它的长度是此字符串的长度,而且内容被初始化为包含此字符 ...
- JavaScript模拟函数重载
JavaScript是没有函数重载的,但是我们可以通过其他方法来模拟函数重载,如下所示: <!DOCTYPE html> <html> <head> <met ...
- hive脚本出现Error: java.lang.RuntimeException: Error in configuring object和Caused by: java.lang.IndexOutOfBoundsException: Index: 9, Size: 9
是在reduce阶段报的错误,详细错误信息是 朱传豪 19:04:48 Diagnostic Messages for this Task: Error: java.lang.RuntimeExcep ...
- C# 枚举(enum)
public enum EnumStatus { On=0, Off=1 } //获取值:0 Convert.ToInt32(EnumStatus.On); //获取On EnumStatus.On; ...
- Wireshark工具创建过滤器的方式
Wireshark工具创建过滤器的方式 [实例1-3]现在要抓取目的或来源地址为192.168.5.9的封包.在图1.5中添加如下所示的条件: tcp dst port 3128 添加后单击Star ...
- windows安装python问题
在安装python过程中,直接下一步,安装好了,配置环境变量的时候如果找不到安装路径在哪,打开开始菜单,在左边的程序栏找到: 这样就找到了,然后在系统变量中加入即可.如果找不到的话,以联想电脑为例一般 ...
- Thymeleaf 集成spring
Thymeleaf 集成spring 如需先了解Thymeleaf的单独使用,请参考<Thymeleaf模板引擎使用>一文. 依赖的jar包 Thymeleaf 已经集成了spring的3 ...
- Java 生成16/32位 MD5
http://blog.csdn.net/codeeer/article/details/30044831