fontawesome图标怎么使用，fontawesome如何安装图标

今天小编为大家分享Windows系统下载、Windows系统教程、windows相关应用程序的文章，希望能够帮助到大家！

很多人都会搜索：如何在PS上使用Font Awesome字体到这个博客，也许你们想搜索的并不是如何在Photoshop上使用fontawesome，而是如何将font-awesome应用到自己的前端开发项目中。

Font Awesome是一款很流行的字体图标工具。随着Bootstrap的流行而逐渐被人所认识，现在FontAwesome不仅仅可以在bt上使用，还可以应用在各种web前端开发中。相对于传统的使用背景图片作为图标，字体图标主要是支持自适应、可以使用字体的各种特性（比如变色、变大变小、字体阴影等）、减少数据加载、样式更容易定义等。

不需要JavaScript要求：更快的载入速度

无限的可扩展性：可伸缩矢量图形意味着每一个图标在任何大小看起来真棒。

自由免费：你可以将它应用到你的商业中。

CSS控制：轻松的定义图标的颜色，大小，阴影，和任何与CSS相关的特性。

完美的视网膜显示：使用矢量字体，这意味着他们可以完美的显示在高分辨率显示器中

为BootStrap而生：完全的兼容BootStrap新版3.0

桌面友好：你可以查看字体的样式列表

兼容屏幕阅读器：不像其他字体图标不兼容屏幕阅读器

你只需要到： fontawesome.io�0�2下载压缩包然后解压到你的项目中。

在你的HTML头部的head里面添加对相应的font-awesome的样式。

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

如需兼容IE浏览器，可以使用Font-awesome的3.2.1版本。下载font-awesome-ie7.css或者是font-awesome-ie7.min.css。然后在项目中引入该样式文件。

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

/*Font-face首先第一步设置调用fontawesome的路径

=============================================================================*/

font-family:'FontAwesome';

src:url('../fonts/fontawesome-webfont.eot?v=4.3.0');

src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0')format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.3.0')format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.3.0')format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.3.0')format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular')format('svg');

=============================================================================*/

font:normalnormalnormal1.6rem/1"FontAwesome",sans-serif;

-webkit-font-smoothing:antialiased;

-moz-osx-font-smoothing:grayscale;

-webkit-transform:translate(0,0);

/*Iconmapping第三部配置content，content里面的代码就是具体的fontawesome图标了

=============================================================================*/

.am-icon-arrow-circle-o-down:before{

.am-icon-arrow-circle-o-up:before{

.am-icon-play-circle-o:before{

上fontawesome的官网下载相关的文件，那里也有例子说明的，说白了，这个fontawesome就是他们制作好的svg矢量图，然后通过content代码获取到相应的矢量图，在页面上展示，因为是矢量图，而且材料很丰富，所以很受欢迎。

wwW.Xtw.Com.cN系统网专业的PC、手机系统开发下载平台，HarmonyOS系统、安卓、OS、windows电脑重装系统在线下载安装,操作系统平台技术学习,攻略教程,技术交流。