Iconfont在IE7下需要使用unicode方式,但是这种方式不太方便,使用以下代码可使IE7像普通用法使用。

@font-face {font-family: "anticon";
src: url('/font/iconfont/iconfont.eot'); /* IE9*/
src: url('/font/iconfont/iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('/font/iconfont/iconfont.woff') format('woff'), /* chrome, firefox */
url('/font/iconfont/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
url('/font/iconfont/iconfont.svg#anticon') format('svg'); /* iOS 4.1- */
}
.anticon {
font-family:"anticon" !important;
font-size:16px;
font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
} .icon-codepen {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
.icon-home {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
.icon-menu-fold {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
.icon-menu-unfold {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
.icon-doubleleft {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}
.icon-doubleright {
*zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

把所有的需要用的图标做一份,以后就可以直接使用了,另外在IE7下使用ToogleClass切换Icon不起作用,扩展Jquery方法如下

//扩展ToggleClass支持IE7
$.fn.extend({
toggleClassIE7:function(p_para1,p_para2){
if(/MSIE 7.0/ig.test(navigator.appVersion)) {
var $clone = $(this).clone(true);
if($clone.hasClass(p_para1)) {
$clone.addClass(p_para2).removeClass(p_para1);
} else {
$clone.addClass(p_para1).removeClass(p_para2); }
$(this).after($clone);
$(this).remove(); } else {
$(this).toggleClass(p_para1+" "+p_para2);
}
}
});

使用的地方用toggleClassIE7即可。总体上ie7坑太多,还是建议放弃支持为好。

IE7下使用兼容Icon-Font CSS类的更多相关文章

  1. 0c-42-ARC模式下如何兼容非ARC的类

    1.ARC模式下如何兼容非ARC的类 让程序兼容ARC和非ARC部分.转变为非ARC -fno-objc-arc 2.将MRC转换为ARC ARC也需要考虑循环引用问题:一端用strong,一端用we ...

  2. 1.ARC模式下如何兼容非ARC的类

    ARC模式下如何兼容非ARC的类 :转变为ARC的, -f-objc-arc 非ARC模式下如何兼容ARC的类 :转变为非ARC -fno-objc-arc

  3. Angular 1.2.27在IE7下的兼容问题

    最近负责公司的一个国外项目,老外指定要用angular,并且要兼容到IE7. 项目使用的是Angular版本是1.2.27,为了能在IE7下跑,需要做如下配置 1. 加载json2.js 2. 加载h ...

  4. jquery解析XML在IE7下不兼容的问题

    jquery在解析XML内容的时候在IE7下无法显示,是因为数据格式的问题,解决办法如下: $.ajax({        type:"POST",        url:&quo ...

  5. CSS Sprites+CSS3 Icon Font

    CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...

  6. DIV+CSS IE6/IE7/IE8/FF兼容问题汇总

    1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了 <meta http-equiv="x-ua-comp ...

  7. DIV+CSS IE6/IE7/IE8/FF兼容问题大全

    1. [代码][CSS]代码 1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 2, 居中问题. 1).垂直居 ...

  8. IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...

  9. 兼容IE6,IE7和firefox可以使用的一些css hack:

    .一些问题是浏览器自身的问题,遇到问题发生无法避免的情况下,那就要考虑使用一些css hack了,以下是针对IE6,IE7和firefox可以使用的一些css hack:(1) a: 针对区别IE6 ...

随机推荐

  1. c/c++ 继承与多态 文本查询的小例子(非智能指针版本)

    问题:在上一篇继承与多态 文本查询的小例子(智能指针版本)在Query类里使用的是智能指针,只把智能指针换成普通的指针,并不添加拷贝构造方法,会发生什么呢? 执行时,代码崩掉. 分析下面一行代码: Q ...

  2. Python基础之元组

    元组初识 元组的认识 首先,我们来认识一下元组: # 定义一个元组 uesr_tuple = ("zhangsan", "lisi", "wangwu ...

  3. RESTful学习及应用

    原文转自前端路上,转载请注明出处:http://refined-x.com/2017/09/22/RESTful学习及应用/ RESTful是什么 RESTful是一种API架构,符合REST设计原则 ...

  4. 随机排序std::vector,扑克牌,麻将类尤其合用

    有些需要重新对std::vector对象重新排序,特别是游戏,例如说:扑克牌,麻将,抽奖等,C++标准已经为std::vector写好了随机排序的方式,这里做个笔记: #include <alg ...

  5. 码农也来关注下经济问题<美元加息>对我们的影响

    昨天凌晨三点,美联储宣布加息25个基点,这是今年美联储第四次加息,也是2015年12月份以来的第九次加息.基准利率又上调了25个基点,全球市场又要开始惴惴不安了. 要知道上一次美国基准利率上调25个基 ...

  6. ztree 获取子节点所有父节点的name的拼接

    ztree 获取子节点所有父节点的name的拼接 //获取子节点,所有父节点的name的拼接字符串function getFilePath(treeObj){if(treeObj==null)retu ...

  7. 前端架构师 摘自《前端架构设计》-micah godbolt

    作为前端架构师,你经常需要制定,或至少能够掌握以上所列的每一项内容.流程中的任何一个环节出现问题,都会迅速演变为开发人员的痛苦,或者导致网站无法持续满足用户要求,甚至崩溃.  前端架构师的用户是开发人 ...

  8. CentOS7.x安装kickstart

    kickstart简介 kickstartkickstart是RedHat公司开源的软件,所以对CentOS兼容性最好,是一种无人值守的安装方式就是将手动安装配置的步骤,记录到文件中,然后通过kick ...

  9. Neutron: Load Balance as a Service(LBaaS)负载均衡

    load balancer 负责监听外部的连接,并将连接分发到 pool member.    LBaaS 有三个主要的概念: Pool Member,Pool 和 Virtual IP Pool M ...

  10. Java Selenium中的几种等待方式

    Selenium自动化性能测试过程中,经常会出现取不到界面元素,主要原因是界面元素的加载与我们访问页面的时机不一致.可能是界面要素过多或者网络较慢,界面一直加载中:为了解决这种问题,selenium提 ...