内容简介:它跟阿里矢量库不同的是:他不需要引入一些繁琐的文件。只需要几个命令就可以直接使用icon图标复制 font-awesome/ 目录到你的项目中,打开 font-awesome/less/variables.less 文件或 font-awesome/scss/_variables.scss文件 ,然后修改 @fa-font-path 或 $fa-font-path 为您的字体目录想要实现如下效果:
Font-Awesome(一套绝佳的图标字体库和CSS框架)
它跟阿里矢量库不同的是:他不需要引入一些繁琐的文件。只需要几个命令就可以直接使用icon图标
方法一 : css导入
<link href="css/font-awesome.css" rel="stylesheet" />
方法二: 定义安装
npm install font-awesome-sass
复制 font-awesome/ 目录到你的项目中,打开 font-awesome/less/variables.less 文件或 font-awesome/scss/_variables.scss文件 ,然后修改 @fa-font-path 或 $fa-font-path 为您的字体目录
示例:
想要实现如下效果:
就可以这样写:
<i class="fa team-member-icons fa-facebook"></i> <i class="fa team-member-icons fa-twitter"></i> <i class="fa team-member-icons fa-google-plus"></i>
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- Font-Awesome
- SelectPage v2.9 发布,移除对 Font-Awesome 的依赖
- 使用font-awesome字体图标库,让你的网站好看10倍
- 在使用vue+webpack模版创建的项目中使用font-awesome
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Implementing Responsive Design
Tim Kadlec / New Riders / 2012-7-31 / GBP 27.99
New devices and platforms emerge daily. Browsers iterate at a remarkable pace. Faced with this volatile landscape we can either struggle for control or we can embrace the inherent flexibility of the w......一起来看看 《Implementing Responsive Design》 这本书的介绍吧!