字体图标兼容IE

一.生成字体图标文件

二.导入字体图标库

@font-face {
	font-family:icomoon;
	src:url('../fonts/icomoon.eot');
	src: url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
	url('../fonts/icomoon.svg') format('svg'),
	url('../fonts/icomoon.ttf') format('truetype'),
	url('../fonts/icomoon.woff') format('woff');
}
[class^="icon-"],
[class*=" icon-"]{
	font-family: icomoon;
	font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 16px/1 icomoon;
  font-size: 18px;
  font-weight:bold;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-number1 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number2 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number3 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number4 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number5 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number6 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number7 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number8 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}
.icon-number9 {
  *zoom:expression(this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
}

三.引用字体图标

<span class="fa icon-number1" style="color: #156BA1;">&#xe908;</span>

四.结果

猜你喜欢

转载自blog.csdn.net/xm393392625/article/details/81632235