Biegral Blog

1.引入下载好的字体文件

2.CSS代码引入

/* 自定义字体图标 */
/* 1.通过@font-face定义自己的字体 */
@font-face {
	/* 2.声明字体名称 */
	font-family: 'wjs';
	/* 3.引入字体文件(约束某一段字符,代表什么图案) */
	src:url(../fonts/MiFie-Web-Font.svg) format('svg');
	src:url(../fonts/MiFie-Web-Font.eot) format('eot');
	src:url(../fonts/MiFie-Web-Font.ttf) format('ttf');
	src:url(../fonts/MiFie-Web-Font.woff) format('woff');
}
.wjs_icon{
	font-family: wjs;
}

.wjs_icon_phone::before{
	content: "\e908";
}
.wjs_icon_tel::before{
	content: "\e909";
}

3.HTML代码

<div class="col-md-2">
	<a class="wjf_app" href="#">
		<span class="wjs_icon wjs_icon_phone"></span>
		<span>手机微金所</span>
		<span class="glyphicon glyphicon-menu-down"></span>
		<img src="images/code.jpg" >
	</a>
</div>

4.最终效果

​