天兴工作室:提供zblog模板 emlog模板 dedecms模板的下载和仿站定制 | RSS订阅 | 网站地图 | 联系我们
天兴工作室自用主题2015版上架销售
当前位置:网站首页 教程 zblogphp教程 正文

zblog使用Font Awesome图标字体教程

天兴工作室 1年前 (2015-04-27) zblogphp教程 2232 ℃ 0 评论
内容加载中......

现在网页流行的不外乎什么自适应(各种框架)、扁平化。图标字体正好符合了这一趋势。使用图标字体优点有:

1、在移动设备、Retina屏幕展示效果优良。

2、拥有跨浏览器支持(甚至是IE6,例如,使用@font-face渲染网页字体)

3、如果使用者调整他们的浏览器设置,可以动态缩放。  

4、可以呈现不同颜色。   

5、可以体现字体和文字相关的CSS属性(就像文字的阴影和渐变)


本文来为大家介绍下zblog使用图标字体的步骤。注意:zblog为zblogphp版本,图标字体用的是较为流行的Font Awesome。

  1. 下载Font Awesome,去官网下载

  2. 文件下载后解压,得到两个文件夹,font和css。上传至你正在使用的主题的“style”文件夹内。

  3. 修改你正在使用主题的header.php文件,插入“<link rel="stylesheet" rev="stylesheet" href="{$host}zb_users/theme/{$theme}/style/css/font-awesome.min.css" type="text/css" media="all"/>”。

  4. 在想要调用图标字体的地方插入”<i class="fa fa-thumbs-o-up"></i>“这种代码即可调用了。

  5. 图标字体的具体调用方法可参考的中文翻译版网站:点击进入


最终效果:

QQ截图20150427213435.png

本文标签图标字体 Font Awesome

本文地址http://www.txcstx.cn/post/765.html

版权说明:如非注明,本站文章均为 天兴工作室 原创,转载请注明出处和附带本文链接。

我猜你还喜欢这些...

额!本文竟然没有沙发!你愿意来坐坐吗?

欢迎 发表评论

必填

选填

选填

必填

◎欢迎在这里交流反馈,垃圾评论会秒删的额...

联系我们
最新评论
标签云
广告位数据业务限时促销百度站内搜索方言送电动车淘好礼手机秒杀zblog网站快速翻页zblog1.3iwork8升级版免费主题电子券半年包2012版问答模板升级刷机努力zblog2.0下载傻X飞young长话卡华为T5900立体主题全球通彩袖卡吸血狂魔zblogphp1.3下载充值包10658888zblogasp转换15元版恶意软件zblog优化校园套餐科技非常慢
热门模板