在开发项目中遇到了矢量图标

一套绝佳的图标字体库和CSS框架

vue 中引入font-awesome

直接npm install font-awesome --save 就可以了,里边包含了样式和字体,直接引入就ok了

import 'font-awesome/css/font-awesome.min.css' 

项目中直接使用

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

react 中引入font-awesome

link

npm install --save react-fontawesome //这里不包含样式,需要引入font-awesome的样式

import React, { Component } from 'react';
import './index.less'; import 'font-awesome/less/font-awesome.less';
import 'react-fontawesome'; <i class="fa fa-camera-retro"></i>
												

font-awesome vue/react 通用的图标的更多相关文章

  1. uni-app,vue,react,Trao之缓存类封装

    uni-app,vue,react,Trao之缓存类封装 一,介绍与需求 1.1,介绍 缓存主要分为如下几个 1.LocalStorage LocalStorage是永久性的本地缓存,存储在客户端的浏 ...

  2. 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  3. 从DOM操作看Vue&React的前端组件化,顺带补齐React的demo

    前言 接上文:谈谈我对前端组件化中“组件”的理解,顺带写个Vue与React的demo 上次写完博客后,有朋友反应第一内容有点深,看着迷迷糊糊:第二是感觉没什么使用场景,太过业务化,还不如直接写Vue ...

  4. Font Combiner – 自定义网页字体和图标生成工具

    Font Combiner 是一个功能丰富的 Web 字体生成工具和字体改进工具,提供字距调整.构造子集.各种提示选项和自定义字体字形组合.您可以生成您自己的自定义字体的格式和文件大小. 另外还有成千 ...

  5. 使用Font Awesome替换你的网站图标

    http://fortawesome.github.io/Font-Awesome/whats-new/ 使用Font Awesome替换你的网站图标 ******************IE7BUG ...

  6. 2015前端各大框架比较(angular,vue,react,ant)

    前端流行框架大比拼 angular vue react ant-design angularjs angular是个MVVM的框架.针对的是MVVM这整个事.angular的最主要的场景就是单页应用, ...

  7. 前端开发组件化设计vue,react,angular原则漫谈

    前端开发组件化设计vue,react,angular原则漫谈 https://www.toutiao.com/a6346443500179505410/?tt_from=weixin&utm_ ...

  8. 三种Web前端框架比较与介绍--Vue, react, angular

    一.Angular 1.MVVM(Model)(View)(View-model): 2.模块化(Module)控制器(Contoller)依赖注入: 3.双向数据绑定:界面的操作能实时反映到数据,数 ...

  9. 谈谈Vue/React中的虚拟DOM(vDOM)与Key值

    谈谈Vue/React中的虚拟DOM(vDOM)与Key值 一.DocumentFragment 在了解虚拟DOM前,先来了解DOM的一个对象属性--DocumentFragment. 在一次操作中, ...

  10. Angular Vue React 框架中的 CSS

    框架中的 CSS Angular Vue React 三大框架 Angular Vue 内置样式集成 React 一些业界实践 Angular Angular . js (1.x):没有样式集成能力 ...

随机推荐

  1. c语言创建线程的函数封装

    头文件xxx.h #include <stdlib.h> #include <pthread.h> #include <string.h> typedef int ...

  2. windows远程桌面之前用于连接到xxx的凭据无法工作

    使用windows远程桌面连接时报错提示: 之前用于连接到xxx的凭据无法工作 确认输入的用户名密码没有问题 解决方法: 打开gpedit.msc组策略管理,依次找到 计算机配置 > windo ...

  3. cpp chrono basic

    // cpp 20 //c++ - Number of seconds since midnight - Stack Overflow //https://stackoverflow.com/ques ...

  4. @JsonFormat

    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss",timezone = "GMT+8" 不管是前端传后台,还是后台传前端, ...

  5. kali WiFi相关研究(学习中...)

    基础环境准备: 笔记本一台E470c(内置网卡 Qualcomm Atheros QCA9377 802.11ac) # 经过测试创建虚拟AP不成功 外置网卡一个:UGREEN 绿联AC1300M,芯 ...

  6. k8s_namespace

    namespace 可以认为namespaces是kubernetes集群中的虚拟化集群.在Kubernetes集群可以拥有多个命名空间,它们在逻辑上彼此隔离. 多数的Kubernetes中的集群默认 ...

  7. A Novel Sequential Method to Train Physics Informed Neural Networks for Allen Cahn and Cahn Hilliard Equations

    一种新的顺序方法去求解关于时间的方程.个人感觉论文很差.(方法不新颖,写作很无聊,排版也有问题,内容也表述不清). 本文提出一种利用单个神经网络,在连续时间段上顺序求解偏微分方程的新型方案.关键思想是 ...

  8. 1.java 开始

    WelloWorld 随便新建一个文件夹,存放代码 新建一个java文件 编写代码 编译javac java文件,生成一个class文件 运行class文件,java class 可能遇到的情况 每个 ...

  9. vue store用法

    import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) 首字母不能大写 export default new Vuex.Store({ ...

  10. 本地启动https服务器

    如果是vue-cli3项目,直接在vue.config.js中设置如下即可: devServer: { https: true } 如果是express项目,则根据这篇文章来操作即可:https:// ...