Font Awesome 是一个非常方便的图标库。这些图标都是矢量图形,被保存在 .svg 的文件格式中。这些图标就和字体一样,你可以通过像素单位指定它们的大小,它们将会继承其父HTML元素的字体大小。

你可以将 Font Awesome 图标库增添至任何一个应用中,方法很简单,只需要在你的 HTML 头部增加下列代码即可:

<link rel="stylesheet" href="//cdn.bootcss.com/font-awesome/4.2.0/css/font-awesome.min.css"/>

当然也可以下载到本地使用,地址:http://fontawesome.io/   http://fontawesome.dashgame.com/ (中文网)

(link的路径根据自己下载保存的位置来定);

使用方式:

i 元素起初一般是让其它元素有斜体(italic)的功能,不过现在一般用来指代图标。你可以将 Font Awesome 中的 class 属性添加到 i 元素中,把它变成一个图标,比如:

<i class="fa fa-info-circle"></i>

使用案例:

官网给出了详细的使用案例哦(可以自己动手试试,真理来源于实践):http://fontawesome.io/examples/

Font Awesome(一套很棒的图标库)的更多相关文章

  1. Font Awesome,一套绝佳的图标字体库和CSS框架

    http://fontawesome.dashgame.com/ http://www.runoob.com/font-awesome/fontawesome-tutorial.html Font A ...

  2. Font Awesome图标库

    Font Awesome 是一个非常方便的图标库.这些图标都是矢量图形,被保存在 .svg 的文件格式中.这些图标就和字体一样,你可以通过像素单位指定它们的大小,它们将会继承其父HTML元素的字体大小 ...

  3. vue中引入.svg图标,使用iconfont图标库

    阿里巴巴的iconfont是一个很好的图标库,海量的素材可以快速满足开发人员日常对图标的诉求,我们采用symbol引用,官方介绍 创建SvgIcon组件 <template> <sv ...

  4. 在nuxt中引入Font Awesome字体图标库

    介绍 在element-ui框架中提供了一些图标样式,但是种类比较少,所以在这里提供一套更完善的字体图标库Font Awesome(官方文档),下面就开始介绍如何在一个nuxt项目中使用这套字体库. ...

  5. EasyDropDown – 很棒的下拉菜单,含精美主题

    EasyDropDown 是一个 jQuery 插件,你可以毫不费力地将简陋的 Select 元素设置为可定制风格的下拉菜单,用于表单或者一般的导航.和著名的下拉插件 Chosen 很像,但是具有自己 ...

  6. 推荐几款很棒的 JavaScript 表单美化和验证插件

    表单元素让人爱恨交加.作为网页最重要的组成部分,表单几乎无处不在,从简单的邮件订阅.登陆注册到复杂的需要多页填写的信息提交功能,表单都让开发者花费了大量的时间和精力去处理,以期实现好用又漂亮的表单功能 ...

  7. 30 个很棒的 PHP 开源 CMS 内容管理系统

    本文汇集了30个优秀的开源CMS建站系统,采用PHP开发.以下列表不分先后顺序. 1. AdaptCMS AdaptCMS Lite 是一个开源的CMS系统,主要特点是易用,而且可以轻松和其他系统接驳 ...

  8. 阿里UX矢量图标库–最强大的矢量图标库(Icon font制作力荐工具)

    继前面介绍过ICON-FONT的制作后,找了几个ICON库都是国外的今天偶然发现阿里巴巴的图标矢量库,www.iconfont.cn用了之后感觉很强大,丰富的图标库(集合阿里妈妈&淘宝的图标库 ...

  9. 优秀工具推荐:两款很棒的 HTML5 游戏开发工具

    HTML5 众多强大特性让我们不需要多么高深技术就能创建好玩的网页游戏,同时证明了开放的 Web 技术能与任何其他在游戏开发中使用的技术竞争.正如标题所说,这篇文章推荐的几款很棒 HTML5 游戏开发 ...

随机推荐

  1. Power BI Embedded 与 Bot Framework 结合的AI报表系统

    最近最热门的话题莫过于AI了,之前我做过一片讲 BOTFRAMEWORK和微信 相结合的帖子 如何将 Microsoft Bot Framework 链接至微信公共号 我想今天基于这个题目扩展一下,P ...

  2. 清理MVC4 Internaet 项目模板清理

    新建项目时选择空的MVC项目 是没有Bundle 引用的非常痛苦,但是如果选择Internet模板 MVC4的模板会帮你添加一堆的JQuery 引用  打开NuGet Console 执行以下指令能帮 ...

  3. 201621123018《java程序设计》第12周作业总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系统或购物车 使用流与文件改造你的图书馆管理系统或购物车. 2.1 简述如何 ...

  4. [学习笔记]K-D Tree

    以前其实学过的但是不会拍扁重构--所以这几天学了一下 \(K-D\ Tree\) 的正确打开姿势. \(K\) 维 \(K-D\ Tree\) 的单次操作最坏时间复杂度为 \(O(k\times n^ ...

  5. linux shell实现批量关闭局域网中主机端口

    假设局域网中有多台主机,只能开通ssh服务(端口22),如果发现其他服务打开,则全部关闭.通过运行一个shell脚本,完成以上功能.在实际运维中,可以通过puppet等工具更快更好的完成这个功能,所以 ...

  6. vue.js生命周期钩子函数及缓存

    在使用vue.js进行开发时,使用最多的就是created.mounted.activated. 由于有些情况下,我们需要复用某些组件,因此需要用到keep-alive. 当引入keep-alive时 ...

  7. Vue.js之下拉列表及选中触发事件

    老早就听说了Vue.js是多么的简单.易学.好用等等,然而我只是粗略的看了下文档,简单的敲了几个例子,仅此而已. 最近由于项目的需要,系统的看了下文档,也学到了一些东西. 废话不多说,这里要说的是下拉 ...

  8. postgresql-脏页和缓存失效

    脏页和缓存失效 https://www.cnblogs.com/flying-tiger/p/7885478.html Dirty pages and cache invalidation 我们一直在 ...

  9. 阿里云centos 开启ipv6

    参考网址 https://blog.chenjia.me/articles/160301-134110.html?spm=5176.bbsr285557.0.0.g1Oemn 阿里云限制了ipv6的功 ...

  10. df换行问题解决

    df换行问题解决 df是linux下用来查磁盘空间的命令,而在使用了LVM分区或网络挂载的情况下,再用df取分区的使用率时,发现有些分区显示换行了,这样会导致通过脚本取的数据不对. [root@ ]# ...