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

一套绝佳的图标字体库和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. jwt二次加密失败原因(Bad “options.expiresIn“ option the payload already has an “exp“ property.)

    在写vue+nodejs项目的校验token时,出现了次错误 然后想了想问题所在: 第一次加密的时候使用jwt.sign(value,秘钥,{}),会返回一个字符串,然后当前端跳转别的发送请求时,会将 ...

  2. C# Socket 通信

    C# Socket通信 Socket通信主要分为两部分,服务端和客户端,其中服务端和客户端都具有接收消息和发送消息的功能,具体通信流程就是服务端先去监听一个端口号,等待客户端的连接,客户端通过指定IP ...

  3. WebRTC 的音频弱网对抗之 NACK

    基础知识 音频的 NACK 机制在 WebRTC 中默认是关闭的. rtcp feedbacknack开启就可以了 WebRTC 的音频数据传输中,尽管对低延时有着很高的要求,但也实现了 NACK,以 ...

  4. [django]钩子函数的一些细节(clean)

    函数名 说明:clean_后面跟着的是需要校验字段名称 示例: class RelUserReset(forms.ModelForm): def clean_confirm_password(self ...

  5. clear_buff-cache.sh

    #! /bin/bash sync;echo 1 > /proc/sys/vm/drop_caches # 表示清除pagecache sync;echo 2 > /proc/sys/vm ...

  6. DOS批处理命令,自动获取本机系统及硬件配置信息

    可以配合域策略自动下发执行, 批量收集域内电脑配置; 手动执行亦可; 如下保存成.bat批处理文件执行即可. /*&cls&echo off&cd /d "%~dp0 ...

  7. .Net Core WebApi AutoFac用法

    1. 安装Autofac.Extensions.DependencyInjection管理包 UI层安装 2.在Program里面配置服务提供工厂 3.在Startup里面添加一个配置容器的方法 使用 ...

  8. 220327_IDEA调试debug时step into看不了方法内部的解决办法

    220327_问题解决_IDEA Debug时stepinto无法进入方法内部的解决方法 File Settings Build,Execution,Deployment Debugger Stepp ...

  9. Java基于ssm师生实验课-实验室-实验设备预约系统源码

    简介 java+ssm开发的实验课实验设备实验室预约系统,老师可预约实验设备和实验室,然后发布实验课和上传实验附件.学生可以报名实验课,也可以自己预约实验室(部分实验室对学生开放)做实验.学生做完实验 ...

  10. mac怎么设置开机自启动项,mac选择开机启动项

    转自 https://www.zhangshilong.cn/work/386853.html Login Items Mac OSX的当前用户成功登录后启动的程序,该类别的启动项配置文件存放在~/L ...