关于字体图标

给body一个字体样式：
（1）

body {
  font-family: "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
}

（2）引入字体图标：
在html中查看元素的字体库，在css中打开，并且复制样式

@font-face { font-family: 'itcast'; src: url('../font/MiFie-Web-Font.eot') format('embedded-opentype'), url('../font/MiFie-Web-Font.svg') format('svg'), url('../font/MiFie-Web-Font.ttf') format('truetype'), url('../font/MiFie-Web-Font.woff') format('woff'); }

（3）
字体图标格式解析：

eot : embedded-opentype
svg : svg
ttf : truetype
woff : woff

（4）写一个通配选择器 把所有的字体图标样式加载进去
[class^=”icon-“],就是所有的以icon开头的被选中
[class*=” icon-“],注意上面选择器中间的空格 表示在后面的名字叫icon

[class^="icon-"],
[class*=" icon-"] {
  /*注意上面选择器中间的空格*/
  /*我们使用的名为itcast的字体就是上面的@font-face的方式声明的*/
  font-family: itcast;
  font-style: normal;//把斜体改成正常
}

（5）
若想让元素垂直显示，可以给该父级元素设置 高度和行高 相等想让元素水平居中使用bootstrop中给定的 text-center即可
（6）
因为有hover效果 所以最好用一个a标签包裹起来
比如：因为hover之后要有一个图片显示出来，故img标签要放到a里面

<div class="col-md-2 text-center">
  <a class="mobile-link" href="#">
    <i class="icon-mobile"></i>
    <span>手机微金所</span>
    <!-- 这里使用的是bootstrap中的字体图标 -->
    <i class="glyphicon glyphicon-chevron-down"></i>
    <img src="..." alt="">
  </a>
</div>