第一步: 在iconfont库中,找到你想要的图标,加入到购物车,再在购物车中将图标加入到你的项目中去    第二步: 在项目中,可以看到刚刚加入的图标,这里是你在项目中所有用到的iconfont,选择下载至本地 第三步: 将下载的压缩包解压,将其中的css.eot.svg.ttf.woff文件放入到你的项目中(若项目之前有这些文件,则直接替换即可,因为下载的文件中包含了你项目中所有的图标),此时可以看到,css.svg中加入了你想要的图标 第四步: 以上三步就已经将你想要的iconfont加到…

在main.js中 import './assets/images/iconfont/iconfont.css'import './assets/images/iconfont/iconfont.js' assets / images / iconfont中的东西 就是你下载的文件 解压出来的 在组件中使用的话 <svg class="icon closeImg" aria-hidden="true"">           <use x…

阿里iconfont的使用   1. 找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中一个账号登陆一下就行了 假如你使用微博登陆,点击以下新浪微博,扫一下二维码就登陆上了,或者使用用户名和密码登陆都可以 7.登陆成功之后,网站会提示你是否同意登陆,点击同意就可以了 8.然后回来接着点击购物车,下载代码: 9.下载解压以下 10.打开加压的文件夹,看一下文件 11.我们打开第一个dem…

Hexo-使用阿里iconfont图标 因为使用hexo搭建的博客中,大家并不懂都有什么图标,fa fa-xx就懵了,不知道都有什么. 首先,fa fa-xxx中的图标可以在 图标库 中寻找. (上面慢的话,可以在这个:另一个图标库) 例如: 首页: / || fa fa-home 归档: /archives/ || fa fa-archive 标签: /tags/ || fa fa-tags 显而易见,就算能找到也有很多图标找不到,所以这个时候,我们可以选择使用阿里iconfont图标 建立项…

在上一篇文章中介绍了如何在vue项目中使用vue-awesome,如果你想了解,请移步<vue项目中使用vue-awesome> 这里介绍一下vue项目中如何使用阿里的iconfont图标库,先看一下官网 可以看到有将近两百万的图标量,可以说我们想要的矢量图图标这里大部分都是有的,下面直接开始如何在vue项目中使用,方法有两种 方法一:简单粗暴法 1.打开 iconFont官网 选择自己喜欢的图标,并且添加购物车 例如我现在选择三个图标 点击购物车,添加至项目 为了方便可以给项目起一个名字 选…

安装 安装openlayers安装指定包安装openlayersVUE中的地图import ol from "openlayers";import "openlayers/dist/ol.css"; cnpm install openlayers --save 安装jquery cnpm install jquery --saveimport $ from 'jquery' 安装 bootstrapnpm install bootstrap --save-dev /…

原文:iconfont的引入方法   第一步:使用font-face声明字体@font-face {font-family: 'iconfont';src: url('iconfont.eot'); /* IE9*/src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */url('iconfont.woff') format('woff'), /* chrome.firefox */url('iconfo…

前言: 目前正在通过 UNI-APP平台开发移动应用,uni-app平台是去年年出才创建的一个新品台,因此资源相对比较匮乏,在此遇到一个问题,一直使用别人提供的iconfont,但总是不够用,为了解决这个问题,花了些时间给自己也搞了个字体库,如何操作,请看下文. 准备: 阿里巴巴提供资源网址:https://www.iconfont.cn/ 参考文档: https://www.cnblogs.com/xguoz/p/10245641.html  操作: 一.进入网站(长得就是下图这个样子): 二…

1.找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中一个账号登陆一下就行了 假如你使用微博登陆,点击以下新浪微博,扫一下二维码就登陆上了,或者使用用户名和密码登陆都可以 7.登陆成功之后,网站会提示你是否同意登陆,点击同意就可以了 8.然后回来接着点击购物车,下载代码: 9.下载解压以下 10.打开加压的文件夹,看一下文件 11.我们打开第一个demo来看看怎么使用 12 使用 首先…

1.将iconfont中需要的图标,添加到购物车,然后添加到自己的项目.生成在线代码. 2.点击下载至本地.然后解压后复制 iconfont.css 文件到你的项目. 3.复制第一步生成的代码,替换iconfont.css中的@font-face,然后再在//.at前边添加https: 4.再App.vue中引入iconfont.css文件 @import url('static/iconfont/iconfont.css'); // 路径根据自己而定 5.使用图标 <span class=&quo…

一.iconfont的使用范围 在工作当中,经常会用到嵌在元素里的小图标 在这种情况下,如果使用<img>标签或者用作背景图片,也能实现这种效果.但是如果这么做的话,就必须把图片一个个切下来做成精灵图,过于麻烦.而且图标一般都会改变颜色形状,就要求一个图标制作多个状态的图.另外,背景图片还牵扯到background-size的兼容性问题,不容易控制大小和位置.而使用字体图标,完全可以避免这些问题,不仅 可以改变大小,还可以改变颜色. 二.常用字体图标的方式 阿里巴巴矢量图库( http://w…

步骤一:下载项目图标 步骤二:解压文件,重命名 iconfont.css为 iconfont.wxss ,并复制 到项目 static文件夹 icon文件夹下                     iconfont.wxss文件内容如下 步骤三:在项目中 全局app.wxss 或者需要 单独文件项目 index.wxss 引用 @import '/static/icon/iconfont.wxss'; 步骤四:在项目中 index.wxml文件中调用即可 <text class='iconfo…

我们使用element-ui.vue开发网站的时候,往往图标是起着很重要的作用. 下面是vue.element-ui项目,如何使用阿里iconfont图标库的方法. 准备工作 1. 先注册,再登录.找到图标管理.我的项目 2. 点紫色的这个创建自己的项目 3. 图中画红线的地方很重要 1).FontClass/Symbol前缀这个很重要,一定不要写成:el-icon-***这样的形式. 如果你写成这样的前缀,会和element-ui框架所带的图标(icon)冲突,导致你图标显示不出来 2).Fo…

什么是 IconFont 顾名思义,IconFont 就是字体图标.严格地说,就是一种字体,但是,它们不包含字母或数字,而是包含符号和字形.您可以使用 CSS 设置样式,就像设置常规文本一样,这使得 IconFont 成为 Web 开发时图标的热门选择. IconFont 的背景 WebFont 我们都知道,在网页制作中,会经常用到不同的字体,常用的有 微软雅黑.宋体.Aria 等等.在我们写css的样式的时候,通过 font-family 可以指定元素的字体名称,我们称这类字体为 WebFon…

图标字体(IconFont)介绍 图标字体(IconFont)现在越来越被广泛使用,大大提高了网页的多样化,解决了视网膜屏幕失真的问题. 据说微软从IE4开始支持的这个私有方法(@font-face),后来W3在CSS2中也引入这个方法,但是后来CSS2.1又被删除了,真是遗憾.直到CSS3,又一次引入,这真是个好消息. 详细见:http://www.w3.org/TR/css3-fonts/. 不过经常会被问到,移动端用没问题,PC上IE可以了,我可以负责任的说:当然可以.原因上面说了,@fo…

第一步 在AI中画好矢量图,或者是在PS中将纯色的图片存成PNG格式,最好是放大很多倍的纯色图片.因为导入到fontcreator中会显得很小,如果不是矢量,图片拉大后就会有锯齿状. 第二步 选中AI中的矢量图形复制,打开fontcreator,选择一个已经安装过的字体或是选择新建工程,这里采用新建工程来演示. 一般前几个空着的不要动,选择A后点击插入字形就会有这样一个空白的格子,选择这个空白的格子右键 右键然后选择属性,代码点里可以从$E000开始往后写,写完后记得点击右边的闪电标志,进行检索…

阿里短信服务:支持三大运营商短信.智能管道等优质能力,产品特点:3秒可达.99%到达率.超低资费. 使用阿里短信服务步骤: 1.购买服务 到https://market.aliyun.com/products/57002003/cmapi011900.html#item-1购买短信服务 2.设置签名档 3.创建短信模板 4.根据demo接入阿里短信服务 请求参数: 名称 类型 是否必须 描述 ParamString STRING 可选 模板变量,其中数字必须转换为字符串,个人用户每个变量长度必须…

第一步先创建一个免费的证书 步骤一:申请免费证书 步骤二:填写你的二级域 步骤三:等待审核通过,通过后,点击下载 步骤四:根据自己服务器类型,下载对应的证书,根据阿里云的安装步骤做 以下是阿里云提供的iis7/8安装步骤 IIS 7/8 支持PFX格式证书,下载包中包含PFX格式证书和密码文件.以沃通证书为例: 文件说明: 1. 证书文件1****************.pem,包含两段内容,请不要删除任何一段内容. 2. 如果是证书系统创建的CSR,还包含:证书私钥文件1**********…

自定义iconfont 图标库扩展 在Hbuilder开发移动App的使用及svg彩色图标(或mui图标库的自定义扩展) 前提准备:1.登录阿里iconfont图标库,创建自己的项目,地址:http://www.iconfont.cn/:2.制作svg格式的图标,并上传至阿里图标库iconfont. 具体操作: step1:  从阿里iconfont下载图标本地包 step2: 从本地文件里摘出iconfont.css,iconfont.ttf, iconfont.js三个文件,放入到自己的项目…

在ubuntu下用apt-get install安装软件时,发现package list中没有所需的软件, 估计可能是package list太旧了,于是需要apt-get update & apt-get upgrade. 但又怕原始的源慢,故修改为阿里云镜像.步骤如下: 1.备份原始源的配置文件: sudo cp /etc/apt/sources.list /etc/apt/sources.list.bakcup 2.添加阿里云源到sources.list文件: sudo vim /etc/…

阿里IconFont平台 http://www.iconfont.cn/ 这里是阿里巴巴UED部门开发的IconFont平台,眼下阿里系的重量级产品都在使用,里面有非常多资源可供使用. 这里说说怎样在client内使用. IconFont尽管看起来是图标.实际原理跟字体的实现方式是一样的,所以我们把每一个Icon当作一个特殊的文字来理解和处理. IconFont使用 1.首先登录站点,搜索你要用的Icon.把它们增加购物车(点击就能够). 2.把购物车里的全部Icon存储在同一个项目中. 3.进…

引用 阿里的 iconfont 发现跟我的文字不居中 页面中实际展示的时候,发现 iconfont 字体飘起来了 原因是:iconfont 的基线跟 文字 的基线不同导致的. 解决办法:给 iconfont 设置 vertical-align:middle; 如果是用的用的阿里iconfont 的下载包,修改 iconfont.css 文件即可:…

查看一些网站代码的过程中,会发现许多的图片是不是背景图片或者<img>,而是类似于下面这样: .iconfont{ font-family:"iconfont" !important; font-size:30px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } 这就是…

前言 鉴于有些用户直接想使用现成的物联网平台实现 OTA 远程升级 我就写一写这系列的文章 注意:首先大家必须把我自建服务器是如何实现的看明白! 我看了下阿里云提供的,实际上流程和咱自建实现的差别不大 https://help.aliyun.com/document_detail/85700.html?spm=a2c4g.11186623.6.699.6292740d5hzKl6 首先控制升级获取当前程序的版本号等走的还是MQTT 设备端首先通过MQTT获取云端的版本信息,还有程序固件的http…

使用百度云服务器,发现百度yum源非常不稳定,果断采用阿里源,操作步骤如下: 一.备份 $ cd /etc/yum.repos.d/ $ mv baidu-bcm.repo baidu-bcm.repo.backup $ mv CentOS-Base.repo CentOS-Base.repo.backup 二.下载新的CentOS-Base.repo 到/etc/yum.repos.d/ ##查看Centos操作系统版本,选择对应的源 $ cat /etc/redhat-release ##C…

今天想在docker中安装vim工具,还有其他的软件等等,如果你直接执行apt-get install vim是没有用的,会显示: root@7d43d83fd3a8:/etc/nginx# apt-get install vim Reading package lists... Done Building dependency tree Reading state information... Done E: Unable to locate package vim 看样子是不可以安装的,我们…

本来Jerry觉得这个知识点太简单了完全不值得写成微信公众号文章,但转念一想,可能网络上有一些刚刚初学UI5的朋友们可能会问到,所以还是写了. 今天一个成都同事问我这个问题,因为SAP WebIDE可以非常方便地将开发好的UI5应用一键部属到SAP的其他系统,比如On-Premises环境的SAP gateway系统:但对于SAP Cloud Platform之外的其他云平台,比如AWS或者阿里云,SAP官方文档讲得不多. 其实如果已经在WebIDE里完成了UI5应用的开发,要让它运行在其他Ia…

个人想做个网站,就买了个阿里云服务器,不得不说阿里的安全做的很好,但是对于我这种小白,就成了麻烦了 工具/原料   阿里云服务器 方法/步骤     首先百度搜索阿里云,进入登录界面,输入账号密码登录   登入后,点击控制台,这里是对你的服务器进行设置的   点击云服务器ECS,选择你的服务器   点击更多下面的安全组配置   点击配置规则,如果没有创建安全组就先点击加入安全组,创建一个安全组   点击创建安全组规则,按照下图配置,注意你的端口范围,看你服务器的端口号,一般都是80   这样就可…

阿里云为开发人员提供了免费的仓库~~ 登录阿里云 ,选择容器镜像服务,当前是2019/08/13 ,之后不知道阿里云控制台菜单会不会调整哈 进入容器镜像服务菜单,创建仓库,需要绑定git仓库 怎么上传/查看自己制作的镜像到阿里云仓库呢,阿里云提供操作步骤,按照步骤来就好 查看自己制作的镜像…

看别人的项目有各种各样的图标既好看占用内存还小 后来才知道原来有icon图标这个东西,原谅我真的一直处于混沌的状态. 刚好最近项目使用了uniapp框架,引入iconfont的方式和之前有些不太一样 1.在阿里iconfont官网上选择完毕自己想要的图标之后 点击添加至项目.2.选择我的项目 下载文件至本地,在APP.vue中引入本地iconfont.css文件 点击Unicode查看复制在线链接 替换iconfont.css内 @font-face {} 里面的内容 APP端切记 // 前方要…