`

Font Awesome字体图标简单介绍

阅读更多

(1)前言

   网页常用到图标,例如QQ,微信等图标.这里介绍个常用的实现方法--Font Awesome字

(2)简介

   Font Awesome 是一套绝佳的图标字体库和CSS框架。

   Font Awesome 字体为您提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。

要使用Font Awesome图标,请在HTML页面的 部分中添加以下行:

①国内推荐 CDN:

<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">

②海外推荐 CDN

<link rel="stylesheet" 
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

注意:如果是练习用, 不用下载,直接在 html 文档头部引用 CDN 文件即可。

注意: 这里使用的是 4.7.0 版本。

(3)使用

   如果是开发用,那么建议下载到项目里.注意位置要和css里引用路径对应.一般默认路径为项目的一级目录下.许多同学可能都会出现字体图标不显示的问题,这基本都是路径引起的

(4)下载:下载好后解压到项目文件下即可

Download

(5)图标对照表

http://www.runoob.com/font-awesome/fontawesome-icons-webapp.html

 

 

 

 

 

分享到:
评论

相关推荐

    FontAwesome字体图标元件库.rar

    "FontAwesome字体图标元件库.rar" 这个标题表明了这是一个与FontAwesome相关的资源包,且是为Axure设计工具准备的字体图标元件库。Axure是一款广泛使用的原型设计工具,允许设计师快速创建交互式原型。而FontAwesome...

    font awesome 3.2.1 图标资源及离线文档

    Font Awesome 是一个广泛使用的图标库,它将矢量图形与Web字体技术相结合,使得开发者可以在网页设计中方便地使用各种图标。在3.2.1版本中,它提供了丰富的图标集合,涵盖了社交网络、导航、文件类型等多种类别,极...

    FontAwesome4.5.0图标字体元件库.rar

    3. **在AXURE中导入字体**:在AXURE中,打开"站点设置",在"字体"部分点击"+"添加新的字体,然后从系统字体列表中选择刚刚安装的FontAwesome字体。 4. **使用图标**:现在,在AXURE的元件面板中,你可以输入图标...

    FontAwesome4.5.0图标字体元件库.rplib

    FontAwesome4.5.0 axure导入即可

    FontAwesome v5.7.2字体图标元件库(Free版)

    Axure是一款强大的原型设计软件,允许用户快速创建交互式 wireframes 和 prototypes,而FontAwesome的集成使得图标选择和应用变得更加简单。 **FontAwesome 5.7.2 版本的特点:** 1. **丰富的图标集合**:此版本...

    C# Winform使用Font Awesome图标

    总之,通过引入Font Awesome字体文件并正确地注册和使用,C# Winform开发者可以轻松地在界面上集成丰富的图标,提高应用的专业性和用户体验。记得根据项目需求选择合适的图标风格(Solid、Regular或Brands),并利用...

    字体图标 font awesome pro5.7.2

    为了便于使用,这个压缩包包含了“fontawesome-pro-5.7.2-web.zip”文件,其中包含了所需的字体文件和CSS样式表。只需将这些文件部署到项目中,按照文档说明配置,即可轻松启用Font Awesome Pro的功能。同时,提供的...

    Axure FontAwesome4.4.0图标字体元件库

    在 Axure 中使用 FontAwesome 4.4.0 图标字体元件库,可以极大地丰富原型的视觉表现力,提升设计的专业度。这个元件库包含了FontAwesome的4.4.0版本,该版本包含了超过500个不同类型的图标,涵盖了社交网络、通用...

    FontAwesome4.5.0图标字体元件库

    FontAwesome 4.5.0是深受开发者喜爱的一款图标字体库,它包含了大量的矢量图形,可用于网站设计、前端开发等多个领域。这个版本提供了超过500个可复制的图标文字,使得开发者能够轻松地在网页上添加各种各样的图标,...

    WPF 字体图标(FontAwesome、IconFont)简单使用源码

    其中,字体图标(如FontAwesome、IconFont)提供了一种高效且灵活的方式来展示图标,无需处理图片资源,只需引用相应的字体文件即可。下面将详细介绍如何在WPF中使用字体图标,并扩展讲解其背后的原理和技术。 首先...

    fontAwesome图标字体库.rar

    // 使用FontAwesome字体,调整大小 ``` 3. **颜色和大小调整**:使用Qt的样式表(CSS-like)语法,我们可以改变图标的颜色、大小等属性。例如,将图标颜色设为红色,大小为32像素: ```cpp iconLabel-&gt;...

    Font Awesome Pro v6.5.1 专业零售版 网站开发必备图标库

    Font Awesome Pro v6.5.1 专业零售版 网站开发必备图标库 Font Awesome Pro 是一个广泛且多样化的图标集合,专为 Web 开发和桌面应用程序而设计。 此版本 v6.5.1 提供了各种高质量图标,可以增强项目的美观性和功能...

    swift实现最新的 FontAwesome4.2图标字体(共计479个)

    1.// FontAwesome4.2图标名称对应的 unicode编码 FontAwesome.swift 2./获取ico FontAwesomeIcon.swift / 3.//最新的4.2图标 479 图标对应css样式名字/FontAwesome.ttf 4.//由于官网是境外的访问非常慢,...

    FontAwesome-pro-5.12.0-web

    《FontAwesome 5.12.0 Web版:图标库的艺术与应用》 FontAwesome,作为一款广泛应用的图标库,深受前端开发者喜爱。其5.12.0版本的发布,不仅延续了其一贯的高质量和易用性,还带来了更多的图标选择和功能优化,...

    fontawesome-free-5.15.4-web 压缩包免费版下载

    fontawesome-free-5.15.4-web 在线版 1.进入 Font Awesome官网 2. 在html中引入文件 3.在网页中直接检查图标对应源码 下载压缩包文件 1.下载Font Awesome安装包. 2. 复制整个font-awesome目录到你的项目 3. ...

    FontAwesome4.7.0图标字体Axure 8元件库

    【标题】"FontAwesome4.7.0图标字体Axure 8元件库" 是一个专为Axure 8设计工具打造的资源包,它整合了流行的FontAwesome 4.7.0版本的图标集,使得在Axure中创建原型时能够方便地使用这些高质量的图标。 【描述】...

    Font Awesome Pro v5.15.2

    含web版和桌面版,相信大家都了解过Font Awesome的免费版。事实上,Font Awesome 5 Free现在的图标数量是Font ...Font Awesome 字体提供了可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。

    font-awesome-4.7.0 图标库

    4. 易于集成:Font Awesome 提供了简单易用的HTML和CSS代码,只需在项目中引入相应的CSS文件,就可以立即使用图标,大大简化了开发流程。 二、使用Font Awesome 4.7.0 1. 引入库:在HTML文件中,可以通过添加以下...

Global site tag (gtag.js) - Google Analytics