1 20 50 150 500
欢迎来到云客软件站，找素材，搜软件，就上云客软件站！
当前位置 >首页 >软件下载 >电脑软件 >图形软件 >图标制作

font awesome v4.7.0 官方最新版

软件信息
  • 分类：图标制作
  • 大小：655KB
  • 语言： 中文
  • 环境： WinAll
  • 更新：2024-07-23
  • 评级：
  • 系统： Windows Linux Mac Ubuntu
  • 软件类别： 国产软件 / 免费软件 / 图标工具
  • 插件情况：
  • 相关链接： http://www.fontawesome.com.cn/
软件介绍 下载地址

font awesome是一款功能强大的图标字体库程序，它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。font awesome包含人物、动物、建筑、商业、品牌等等各种主题丰富的图标符号，可以通过相应的语法添加在 Markdown 文档中，像 Emoji 一样配合文字使用。

功能特色：

 一套字库, 675个图标

FontAwesome是一种带有网页功能的象形文字语言，并收集在一个集合里。

 不需要 JavaScript 支持

更少的兼容性问题，因为该字体不需要javascript

 无限的扩展性

可缩放的矢量图形，每个图标在放大或者缩小的时候看起来都正常

 完全开源免费

该字体是完全开源并且免费的，查看许可证.

 CSS 控制

可以轻松的用css来控制字体的颜色，大小，阴影等！

 完美支持Retina屏幕

字体是矢量图，这意味着在高分辨率下也会完美显示。

 良好的兼容性

最初是为Bootstrap而设计的，现在Font Awesome适用于所有框架。

怎么装点markdown文档：

准备工作

要在 Markdown 文档中输入 Font Awesome，需要在文档中任意位置贴粘入如下语句（可以放在文档结尾处，以不影响直接在 Markdown 文档中的阅读）：

<head> 
    <script defer src="https://use.fontawesome.com/releases/v5.0.13/js/all.js"></script> 
    <script defer src="https://use.fontawesome.com/releases/v5.0.13/js/v4-shims.js"></script> </head> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css">

其中最后一行是表示此文档需要导入 Font Awesome 最新版本 5.0.13（截止至 2018.06.11）的图标符号，前面的四行是用于将 Font Awesome 4.x 版本的语句转化为 5.0.13 版本。这是因为在 2017 年年底发布的 5.0 版本中，对 4.x 版本的大量图标符号的名称进行了重写，加上此四行就可以同时使用 4.x 和 5.x 版本的语句。

插入符号

之后就可以直接插入各类 Font Awesome 符号了，其基础用法是：

<i class="fa fa-weixin"></i>

这表示一个微信图标的符号。直接把它写入文档中即可在编译时得到如下效果：

微信和微博图标符号

获取符号名称

在 Font Awesome 的符号列表中搜索，就可以得到不同的符号的写法，点击符号名称右侧的复制图标，就可以复制它：

获取人人图标符号

获取了常用的符号名称，就可以把它保存在 TextExpander 或 LaunchBar 的 Snippets 等缩写工具中，以备之后快速调用。

还有一个更简单的方法，LaunchBar 中自带了一个 Font Awesome Icons 的动作，可以在其中直接搜索 Font Awesome 符号的写法，具体步骤是：

通过缩写如 FONT 检索到 Font Awesome Icons 动作，回车选择；

通过缩写检索目标符号，如 GOOGLE；

找到后按 → 方向键，在出现的列表中移动光标至右边标记为 HTML 的一行，按 &#8984;Command-C 复制，再在文档中贴粘。

LaunchBar 中的 Font Awesome Icons 动作

由于目前这个动作还并未随 Font Awesome 5.0 的发布一起更新，其中只包含了 4.x 中 786 个图标，且采用的是 4.x 版本的写法。这也就是在上文中需要加入将 4.x 版本转化为 5.0 版本的原因。

从此 LaunchBar 动作出复制出来的符号名称，包含了一个 aria-hidden="true" 的代码，它表示在让电脑朗读屏幕内容时，忽略掉此符号，对显示效果没有影响。如果你没有此需求，可保留此代码，也可以删掉。

修改符号格式

使用 Font Awesome 的另一个优点是，除了上述简单的符号调用，还可以对这些符号进行格式的修改，以实现更丰富的排版可能性。下面列举几个日常用得到的有趣格式。

调节尺寸

要调节符号的尺寸，只需对其名称加上尺寸的参数，例如，要调大上文所述的微信图标符号的尺寸，只需把

<i class="fa fa-weixin"></i>

拓展写为：

<i class="fa fa-weixin fa-2x"></i>

即可得到加大尺寸的符号。

放大的微信图标

尺寸参数共有如下几阶，感兴趣的话可以自行尝试其效果：

fa-xs

fa-sm

fa-lg

fa-2x 至 fa-10x

转动

通过在符号名称中加入 fa-spin 就可以使符号变成动态的连贯转动效果，通过 fa-pulse 也可以变成 8 步旋转效果：

转动的符号

引用符下沉

在本文最开始使用的例子中，在引文块的最前面使用了如下代码，即可实现引用符下沉的效果：

> <i class="fas fa-quote-left fa-3x fa-pull-left"></i>

其中，

fa-quote-left 是前引号，

fa-3x 表示符号尺寸，

fa-pull-left 表示使符号下沉。

引用符下沉

下载地址

热门软件

相关软件
Top
Copyright (c) 2019-2020 云客软件站 版权所有
京ICP备2021021884号-2