IE7下使用兼容Icon-Font CSS类
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类的更多相关文章
- 0c-42-ARC模式下如何兼容非ARC的类
1.ARC模式下如何兼容非ARC的类 让程序兼容ARC和非ARC部分.转变为非ARC -fno-objc-arc 2.将MRC转换为ARC ARC也需要考虑循环引用问题:一端用strong,一端用we ...
- 1.ARC模式下如何兼容非ARC的类
ARC模式下如何兼容非ARC的类 :转变为ARC的, -f-objc-arc 非ARC模式下如何兼容ARC的类 :转变为非ARC -fno-objc-arc
- Angular 1.2.27在IE7下的兼容问题
最近负责公司的一个国外项目,老外指定要用angular,并且要兼容到IE7. 项目使用的是Angular版本是1.2.27,为了能在IE7下跑,需要做如下配置 1. 加载json2.js 2. 加载h ...
- jquery解析XML在IE7下不兼容的问题
jquery在解析XML内容的时候在IE7下无法显示,是因为数据格式的问题,解决办法如下: $.ajax({ type:"POST", url:&quo ...
- CSS Sprites+CSS3 Icon Font
CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来, ...
- DIV+CSS IE6/IE7/IE8/FF兼容问题汇总
1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了 <meta http-equiv="x-ua-comp ...
- DIV+CSS IE6/IE7/IE8/FF兼容问题大全
1. [代码][CSS]代码 1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 2, 居中问题. 1).垂直居 ...
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- 兼容IE6,IE7和firefox可以使用的一些css hack:
.一些问题是浏览器自身的问题,遇到问题发生无法避免的情况下,那就要考虑使用一些css hack了,以下是针对IE6,IE7和firefox可以使用的一些css hack:(1) a: 针对区别IE6 ...
随机推荐
- C# 获取当前服务器域名
"http://"是协议名 "www.test.com"是域名 "aaa"是站点名 "bbb.aspx"是页面名(文件名 ...
- 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量?
<!DOCTYPE html> <!-- 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量? 在全局环境下的代码就是在页面加载阶段从上到下一边加载一边执 ...
- modbus串口通讯C#
简介 公司给的一个小任务,这篇文章进行详细讲解 题目: modbus串口通讯 主要内容如下: 1.实现使用modbus通讯规约的测试软件: 2.具有通信超时功能: 3.分主站从站,并能编辑报文.生成报 ...
- 西湖论剑2019-msc之奇怪的TTL
msc1给了一串很长的TTL字符,参考一些隐写的文章,猜测是在ttl中藏了信息,题目是这样的 我们截获了一些IP数据报,发现报文头中的TTL值特别可疑,怀疑是通信方嵌入了数据到TTL,我们将这些TTL ...
- 64位Win7下Asp.net项目连接Oracle时报ORA-6413:连线未打开异常
当时小弟碰到这个问题的时候,也找了挺久的回答,但是回答都是模棱两可的说是因为()的问题,但是没有给出具体的解决方案,这里小弟就用一个比较笨的方法来解决这个问题. 第一种:就是使用本地IISWeb服务器 ...
- Windows中通过命令行启动打开Service 管理工具
经常需要打开Services 管理工具操控Service 的启动,停止. 通过控制面板 --> 管理工具 -->Service 太慢. 学到一个快捷方式. windows + R 启动 ...
- 关于nginx unit服务非正常关闭后,无法重新启动问题的处理
昨天在前领导技术大牛吕哥的帮忙下,python服务管理从nginx+supervisor+uwsgi+python3改为了轻便结构nginx + unit + python3,部署和配置起来顿时轻松起 ...
- #033 信安培训基础题Python解决网络安全实验室|网络信息安全攻防学习平台
第三题猜猜这是经过了多少次加密?分值: 200 加密后的字符串为:一大串 字符串最后面是= 所以是base64.b64decode编码究竟为啥有=就是base64咱也不知道 咱也不敢问咋解密也是从网上 ...
- ubunru18.04下面安装docker
sudo apt-get updat // 更新apt包索引 sudo apt-get remove docker docker-engine docker-ce docker.io // 卸载旧版本 ...
- Socket与WebScoket
socket 英文socket的意思是插座,网络中的Socket是一个抽象的接口,可以理解为网络中连接的两端.通常被叫做套接字接口,其意义在对传输层进行封装屏蔽了传输层的复杂性.它并不是一个协议,是为 ...