iconFont基于bootstrap的扩展

15 篇文章 0 订阅

bootstrap中的字体图标

`这里写代码片`bootstrap内置了大量字体图标,使用方法也很简单,
只需要导bootstrap.css及font文件包,
并在页面引入bootstrap.css即可,只需要用任意标签,
添加相应的类即可,代码如下:
<i class="glyphicon glyphicon-heart"></i>  即为一个❤的图标。

扩展的iconfont

因bootstrap内置的字体图标不够多,在工作中我们也需要扩展字体图库,
就需要我们另外引入字体库,那么我们需要导入 相应字体库的css,font文件,
在页面引入相应的css即可。
❤的字体如下:
<i class="icon-">&#xf004;</i><i class='icon-heart'></i>
&#f004为❤的unico码

自定义字体库

在开发中、尤其是做移动端的页面时,我们仅需要很少的图标字体,
此时就近需要下载某些字体的资源,
那么我们可以直接将相关的svg引入到页面,
然后使用id来展示!

如图
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值