Font Awesome教程

Font Awesome教程

Font Awesome简介

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

Font Awesome特征

一个字体文件,369 个图标。
不需要JavaScript要求:更快的载入速度
无限的可扩展性:可伸缩矢量图形意味着每一个图标在任何大小看起来真棒。
自由免费:你可以将它应用到你的商业中。
CSS控制:轻松的定义图标的颜色,大小,阴影,和任何与CSS相关的特性。
完美的视网膜显示:使用矢量字体,这意味着他们可以完美的显示在高分辨率显示器中
为BootStrap而生:完全的兼容BootStrap新版3.0
桌面友好:你可以查看字体的样式列表
兼容屏幕阅读器:不像其他字体图标不兼容屏幕阅读器

Font Awesome使用

你只需要到: http://www.fontawesome.com下载压缩包然后解压到你的项目中。
在你的HTML头部的head里面添加对相应的font-awesome的样式。
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
根据这里的案例开始你的项目。

参考网站

国内使用比较多的图库是阿里巴巴矢量库:https://www.iconfont.cn/


 

相关教程

  • HTML 教程
    HTML 教程

    超文本标记语言(英语:HyperText Markup Language,简

  • HTML5 教程
    HTML5 教程

    HTML5是超文本标记语言第5代(HyperText Markup Langu

  • CSS 教程
    CSS 教程

    CSS是层叠样式表(英文全称:Cascading Style Sheets)的

  • CSS3 教程
    CSS3 教程

    我们都知道CSS用于控制网页的样式和布局,CSS3是

  • Sass 教程
    Sass 教程

    Sass (英文全称:Syntactically Awesome Stylesheets) 是一个

  • Layui 教程
    Layui 教程

    Layui 是一套开源的 Web UI 组件库,采用自身轻量级

  • Bootstrap3 教程
    Bootstrap3 教程

    Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob

  • Bootstrap4 教程
    Bootstrap4 教程

    Bootstrap4 是一套用于 HTML、CSS 和 JS 开发的开源工

  • Bootstrap5 教程
    Bootstrap5 教程

    Bootstrap5目前是Bootstrap的最新版本,是一套用于

  • AppML 教程
    AppML 教程

    appML是一个为web应用程序设计的HTML扩展框,结合

  • Font Awesome 教程
    Font Awesome 教程

    Font Awesome是为Twitter Bootstrap 设计的图标字体。通

  • Foundation5 教程
    Foundation5 教程

    Foundation用于开发响应式的HTML, CSS and JavaScript 框架