直接引入Font Awesome的css

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

</head>

<body>

<i class="fa fa-camera-retro fa-lg"></i> fa-lg

<i class="fa fa-camera-retro fa-2x"></i> fa-2x

<i class="fa fa-camera-retro fa-3x"></i> fa-3x

<i class="fa fa-camera-retro fa-4x"></i> fa-4x

<i class="fa fa-camera-retro fa-5x"></i> fa-5x

<i class="fa fa-camera-retro"></i> fa-camera-retro

</body>

</html>

有了这个，很多图标放大缩小，改变颜色都变得非常简单，更多参考官方吧~写得很简单明了>>>http://fontawesome.dashgame.com/

图标框架Font Awesome的更多相关文章

  1. 字体图标 轻量级 Font Awesome

    今天呢,来推荐一款请轻量级 字体图标框架.Font Awesome 用法与bootstrap相似 打开网址.download下载,然后打开取到这两个,下载点这里,这个博客弄的挺好的. 找到exampl ...

  2. AngularCli项目中添加字体图标（Font）详解

    本文主要讲如何在AngularCli生成的项目中使用字体图标. 一 SVG图标准备 将需要转换为字体图标的图片转换为SVG格式. 这个让项目视觉设计师搞定即可. 二 SVG图标转Font 可以通过Ic ...

  3. 字体图标Icon Font

    字体图标Icon Font 前段时间研究怎样做字体图标,在网上查找诸多资料,诸多尝试,找到一套可以自己制作自己独立控制的制作流程,公司按照这套流程形成一套自己公司图标,本人目前所在公司已经在使用没有发 ...

  4. font awesome矢量图标框架

    一.font awesome简介 目前图标总数共有519个; 不依赖Javascript 矢量图形,无限缩放 免费,可用于商业 CSS控制样式,自定义图标颜色,大小,阴影,一切可能实现的效果 支持re ...

  5. 字体图标 icon font

    Icon font icon font 指的是用字体文件代替图片文件,来展示图标.特殊字体等元素的方法. 应用场景: iconfont的优缺点 大小能够自由地变化 颜色能够自由地改动 加入阴影效果 * ...

  6. 字体图标：Font Awesome

    小图标 Font Awesome Font Awesome 字体为您提供可缩放矢量图标,它可以被定制大小.颜色.阴影以及任何可以用 CSS 的样式,是一款惊艳的字体图标! 可以前往官网进行学习 Fon ...

  7. 给网站添加图标： Font Awesome

    先贴上各种图标的网址:https://fontawesome.com/?from=io 1.打开网址,我们可以看到: 像我这种英语不好的,直接用谷歌浏览器进行翻译中文好了,自己还是有点B数的····· ...

  8. CSS - icon图标(icon font)

    1. 概念 这个小红点是图标,图标在CSS中实际上是字体. 2. 为什么出现本质是字体的图标? 2.1 图片增加了总文件的大小. 2.2 图片增加了额外的http请求,大大降低网页的性能. 2.3 图 ...

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

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

随机推荐

  1. opencv 车牌字符分割 ANN网络识别字符

    最近在复习OPENCV的知识,学习caffe的深度神经网络,正好想起以前做过的车牌识别项目,可以拿出来研究下 以前的环境是VS2013和OpenCV2.4.9,感觉OpenCV2.4.9是个经典版本啊 ...

  2. JavaScript之this学习心得

    this在运行时绑定,并不是在编写时绑定,它的上下文取决于函数调用的各种条件.this既不指向自身,也不指向函数的词法作用域.this是在函数被调用时发生的绑定,指向什么完全取决于函数在哪里被调用. ...

  3. 关于获取Windows下性能参数的总结

    Windows下特定进程或者所有进程的CPU.物理内存.虚拟内存等性能参数的获取方法小结,包括如何在MFC中以及如何使用C#语言来获取参数. VC API:GlobalMemoryStatus 获取全 ...

  4. Windows 7 x64环境下SDK Manager闪退的解决方法

    1.下载并解压:http://dl.google.com/android/adt/adt-bundle-windows-x86_64-20140702.zip 2.安装JDK,否则SDK Manage ...

  5. 后缀自动机(SAM)速成手册！

    正好写这个博客和我的某个别的需求重合了...我就来讲一讲SAM啦qwq 后缀自动机,也就是SAM,是一种极其有用的处理字符串的数据结构,可以用于处理几乎任何有关于子串的问题,但以学起来异常困难著称(在 ...

  6. js导出带格式的表格(包括单元格合并，字体样式等)

    function HtmlExportToExcelForEntire() { var uri = 'data:application/vnd.ms-excel;base64,', template ...

  7. DSP 程序的执行时间

    在访问TSCL寄存器前要定义 cregister volatile unsigned int TSCL; TSCL/TSCH,它们与CPU同频,共同表示一个64-bit数,CPU运行一个cycle,该 ...

  8. Java集合&Spring源码浅读

    记录自己现在知道的,以后了解了更多的话,再继续补上来 Java集合类 Collection 接口 说明:是List,set 的父类.定义了集合初始模样.集合只存储对象. Jdk8文档,内部方法定义有: ...

  9. C# Socket异步实现消息发送--附带源码

    前言 看了一百遍,不如动手写一遍. Socket这块使用不是特别熟悉,之前实现是公司有对应源码改改能用. 但是不理解实现的过程和步骤,然后最近有时间自己写个demo实现看看,熟悉熟悉Socket. 网 ...

  10. JavaScript中的Map、Set及其遍历

    Map Map是一组键值对的结构,具有极快的查找速度. Map的定义. //空map设值key-value var m = new Map(); m.set("XiaoMing", ...