图标字体Font Awesome 4.7 的引入与使用

下载地址

Download

引入的方式

主要引入font文件夹与font-awasome.min.css文件

假设index.html文件的css都放在同一个目录下的css文件夹中。这时讲fonts文件夹拷入,
fonts文件夹需要与css文件夹在同一个目录下,并且是同等级别。

在css中,需要拷入 font-awesome.min.css 文件。

使用

在index.html中引入。

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/font-awesome.min.css" type="text/css">

在font-awesome.min.css 中修改目录,保证其正确性。

@font-face {
font-family:'FontAwesome';
src:url('../fonts/fontawesome-webfont.eot?v=4.2.0');
src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');

在html中使用示例:

<i class="fa fa-home fa-fw">
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值