大家都知道现在移动端网站设计比较热门，由于移动端的网站页面的收缩性要求很高，必然在网页设计中，一些小点的图标，使用图片收缩性，以及美观上并不是很理想；下面给大家分享一下iconfont矢量图标（字符图片）如何在网页中使用
方法/步骤
1
首先，必须在css声明，需要添加这段： @font-face {font-family: 'iconfont'; src: url('iconfont.eot'); /* IE9*/ src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('iconfont.woff') format('woff'), /* chrome、firefox */ url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */ } .facefont{font-family:'iconfont'; font-style:normal; font-size:16px;}图片生成可以到阿里巴巴矢量图片库，生成，或者下载免费的；下载下来上面的声明路径要到你缩放的目录；
方法/步骤2
这样子就可以了，iconfont图标可以加样式控制哦，大小颜色；实用吧！界面美观的好多
上一篇：煮杂粮粥怎样才会又香又烂
下一篇：如何做补血养生的特色粥