Font Awesome字体图标使用方法|无需引用图标图像

来源:未知 人浏览 2016.05.12

Font Awesome

是一款基于bootstrap的基础上运行

一个字体文件包含了所有图标。

有时候可以省去很多找图标的时间~感觉还是挺好的*-*~~



使用方法:


拷贝 Font Awesome 字体目录到你的项目中。


font-awesome.min.css 文件到你的项目中。


打开你的项目中的 font-awesome.min.css 文件并编辑字体路径指向正确的位置。


引用css样式


<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/font-awesome.min.css">


加载即可!


字体中包含大量的图标,只要写入对应的css即可显示图标


<i class="icon-camera-retro"></i> icon-camera-retro


同样还可以显示图标大小

<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>


当然你自己可以通过css,font-size对图标进行大小控制!


相信你一定会喜欢的~~~


下载地址:http://www.bootcss.com/p/font-awesome/

星期三
15年12月16日
热门板块
windows 10下载设计软件下载PhotoShop CC文章分享Portraiture磨皮win10安装教程
热门下载
Lightroom 5.2官方中文版下载下载(

Lightroom 5.2官方中文版下载下载(

下载
PhotoShop CC下载官方正版可激活版本

PhotoShop CC下载官方正版可激活版本

下载