字体图标的制作或者用现成的方法

/*字体图标（矢量图）的应用*/
@font-face {
    font-family:'dd'; /* 自己定义的名字dd，随便定义*/
    src: url('../font/fontawesome-webfont.eot-v=4.7.0') format('embedded-opentype'),
    url('../font/fontawesome-webfont.svg-v=4.7.0') format('svg'),
    url('../font/fontawesome-webfont.ttf-v=4.7.0') format('truetype'),
    url('../font/fontawesome-webfont.woff-v=4.7.0') format('woff');

}
[class^="icon-"],
[class*=" icon-"]{
    font-family: dd;
    font-style: normal;
}
.icon-cel::before {
    content: "\f107";
}

从别人的网站自己down下来的字体图标，前提是得把那四个文件eot。svg。ttf。woff都得下载下来放在自己的文件夹中。

bootstrap有一部分可以直接用的字体图标，在http://v3.bootcss.com/components/中

<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

还有一种方法是自己造一个字体图标，自己命名之是一个放在外国的网站，能不能刷新出来随缘吧

https://icomoon.io/

点击右上角的app，进到https://icomoon.io/app/#/selec

t进入制作界面，制作完成download一下就可以 ，你可以自己定义他的名字，吧文件放到自己项目文件夹下就可以用css代码进行应用了