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

一套绝佳的图标字体库和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. VS2019编译Qt4.8.7

    下载4.8.7源码Index of /archive/qt/4.8/4.8.7 复制mkspecs\win32-msvc2015到mkspecs\win32-msvc2019 修改qmake.conf ...

  2. solt废弃,报错解决方法

    1.饿了么组件库给出得文字提示框 写到项目里之后报错 提示 solt已经废弃 <el-tooltip placement="top"> <div slot=&qu ...

  3. vue 点击元素滚动到指定位置(滑动到指定位置对应标签自动选中)

    一:各个模块不相同情况 1.内容部分<div class="anchor"> <div v-for="(item,index) in anchors&q ...

  4. docker 文件编写,和jdk11运行java的Dockerfile文件

    制作 docker文件 建立 Dockerfile 文件 拷贝jar文件到 新目录下 FROM openjdk:8 MAINTAINER TsuiChris COPY *.jar /app.jar E ...

  5. PowerShell学习笔记五_模块

    PowserShell其他技巧 1. 执行完一个ps1文件后,不回收 有一个场景,在fun.ps1中,仅仅写了一段 Funtion fun([String] input) { } 然后打开PowerS ...

  6. jmeter-时间处理

    ${__time(,)} 1486091280955 //无格式化参数,返回当前毫秒时间,默认13位.一般用来做时间戳 ${__time(/1000,)} //为取10位的时间戳的函数表达式(时间精确 ...

  7. HarmonyOS基础

    目录 自适应布局 自适应拉伸布局 自适应缩放 自适应延伸 组件多态 ArkUI开发框架 基础组件 Text组件和Span组件 参考 参考:harmonyos3: 鸿蒙ArkUI eTS教程配套源码 参 ...

  8. sshpass免密登录源码剖析

    源码下载地址:https://sourceforge.net/projects/sshpass/ 免密登陆程序sshpass源码解析,短小精悍的程序,非常值得学习!

  9. Win10家庭版安装docker desktop

    1.开启Hyper-V在桌面新建hyperv.cmd文件,内容如下: pushd "%~dp0" dir /b %SystemRoot%\servicing\Packages\*H ...

  10. @EnableAspectJAutoProxy 注解的作用 —— 转载

    @EnableAspectJAutoProxy(proxyTargetClass = true, exposeProxy = true)解决同类方法调用时异步和事务不生效:我们在开启springboo ...