font awesome图标 怎么用到css中

html-css010

font awesome图标 怎么用到css中,第1张

1、引入<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

2、直接页面使用类即可实现<i class="fa fa-camera-retro"></i>

官方链接至 http://fontawesome.dashgame.com/

它跟阿里矢量库不同的是 他不需要引入一些繁琐的文件 只需要几个命令就可以直接使用icon图标

方法一 : css导入

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

方法二: 定义安装

npm install font-awesome-sass

复制 font-awesome/ 目录到您的项目中。

打开 font-awesome/less/variables.less 文件或 font-awesome/scss/_variables.scss文件 ,然后修改 @fa-font-path 或 $fa-font-path 为您的字体目录

FontAwesome为TwitterBootstrap提供了一种独一无二的图像字体.它还提供了CSS的很强的扩展性.CSS提供了一种描述HTML的机制,可以让你自由的设计网页。你能给FontAwesome加上各种各样的参数来满足你的需求,比如说改变字体,字体大小,图标颜色,阴影等等。FontAwesome诱人的特性FontAwesome只为Boostrap设计,BootStrap是一个前端开发的工具,可以帮助我们在线开发响应式和移动项目。即使你拥有不同的网页设计技能,你也能快速使用FontAwesome设计出富有创造性的图标.即使用单一的字体,你也可以创建369不同风格的图标,这一点很像象形语言.FontAwesome现在的版本是4.0.0.兼容性问题不是问题,因为它不依赖JavaScript.定制过程的过程只涉及以直观的方式使用CSS。其可扩展矢量允许你更改图标的大小,以适应任何设计,让你的标志性设计看起来更加吸引人。FontAwesome能很容易的转换为PNG文件.这种文件格式支持无损数据压缩,它使用的PNG文件扩展名或为多用途Internet邮件扩展(MIME)的图像/png格式的媒体类型.使用PNG以全彩色非调色为基础,并支持灰度图像。PNG是一个被广泛使用的网页设计师最常用的无损图像压缩格式。因为在CSS中iconicfont可以使用,你需要将FontAwesome按一下步骤转换为PNG文件:方法一:Step1.从FontAwesomewebsite.下载FontAwesome程序。Step2.从Github上下载theFontAwesomeTTFFile.Step3.保存FontAwesome使用文档。