xx-blog主题使用的图标库是阿里巴巴的iconfont,因此这里介绍一下此主题库的用法。
首先去iconfont主题库,注册一个账号,然后就可以找自己喜欢的图标了,找到后点击添加购物车,就会到了右侧的购物车中,然后去个人中心下载即可。
第一步:将代码加到xx-blog主题style.css中
/* 引用字体文件(注意url中文件的路径)format告诉浏览器这些字体文件以什么格式解析 */ @font-face { font-family: 'iconfont'; src: url('iconfont.eot');/* IE9*/ src: url('iconfont.eot?#iefix') format('embedded-opentype'),/* IE6-IE8 */ url('iconfont.woff') format('woff'),/* chrome,firefox */ url('iconfont.ttf') format('truetype'),firefox,opera,Safari,Android,iOS 4.2+*/ url('iconfont.svg#iconfont') 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 icon-xing"></i>
这样就可以在主题中使用自己定义的样式了。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。