xp系统下ie8是否支持字体图标?

桃源小盼聊技术
  • 733

我看很多字体图标说支持到ie6,阿里妈妈支持ie6,awesome支持到ie7,
那为何xp系统下的ie8及以下并不支持呢?

win7下的ie8支持字体图标。

<!DOCTYPE html>
<html class="no-js" lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>1111</title>
    <meta name="keywords" content="" />
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" type="image/x-icon" href="/static/img/favicon.ico">

    <link rel="stylesheet" href="//at.alicdn.com/t/font_1450669940_6076703.css">

</head>
<body>
    <h1>望远镜<i class="iconfont icon-100"></i></h1>
    <h1>望远镜2<i class="iconfont">&#xe611;</i></h1>
</body>
</html>

图片描述

那个测试网站在我这里也不行

图片描述

xp下ie6直接引用iconfont链接版本,使用样式和字符两种方式均不显示

<!DOCTYPE html>

<html class="no-js" lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>222</title>
    <meta name="keywords" content="" />
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" type="image/x-icon" href="/static/img/favicon.ico">

    <link rel="stylesheet" href="//at.alicdn.com/t/font_1450669940_6076703.css">

</head>
<body>
    <h1>望远镜<i class="iconfont icon-100"></i></h1>
    <h1>望远镜2<i class="iconfont">&#xe611;</i></h1>
</body>
</html>

图片描述

xp下ie6,将iconfont下载下来,融合到自己的css中,使用样式不显示,使用字符显示

<!DOCTYPE html>
<html class="no-js" lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>333</title>
    <meta name="keywords" content="" />
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" type="image/x-icon" href="/static/img/favicon.ico">

    <link rel="stylesheet" href="/static/css/main.css">

</head>
<body>
    <h1>望远镜<i class="iconfont icon-100"></i></h1>
    <h1>望远镜2<i class="iconfont">&#xe611;</i></h1>
</body>
</html>

图片描述

回复
阅读 5.8k
1 个回答

特意开了个虚拟机测试了一下,xp的ie6是支持iconfont的。
iconfont应该和系统无关,只和浏览器有关
ie6版本截图

clipboard.png

iconfont.cn网站截图,可以看到ie6下已经血肉模糊了

clipboard.png

底下的图标无法显示出来,但是这明显不是兼容问题,应该是js脚本执行不了。

clipboard.png

但是从第二张截图中,用户名,搜索那几个icon可以看出,ie6是能支持iconfont的,另外我曾经给学校做过一个项目也使用了iconfont(学校办公设备十多年不舍得换,都是xp),到现在也没有图标看不见的情况。
iconfont的兼容性其实是很好的,毕竟这不是新技术,而是在旧的技术上做了创新,把图标保存到字体文件中。

我使用ie兼容模式测试了http://test.h-ui.net/Hui-3.7-Hui-iconfont.shtml这个网站。
因为只能设置到ie7(ie6设置不了,ie5就算了吧,老古董了)
是完全兼容的。

clipboard.png


xp又测试了下,你那个页面确实没法兼容

clipboard.png
在win10下使用ie兼容模式兼容到5,第二种方案仍然可以用。
第一种方案因为是:before伪类实现的,从ie7开始就不兼容了。

有可能真的和系统有关。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏