Muse-UI引入阿里巴巴字体图标的方法，以及mu-bottom-navigation导航组件使用阿里巴巴字体图标的方法

好紧张第一次写博客，第一次总是痛并快乐着。?有写的不对的，不欢迎广大网友指正???

Muse-UI是一个国外基于vue2.0的移动端的IU框架，个人觉得比国内的移动端IU框架写的要好，不管是从API的详细程度还是iu的美观程度，建议大家去使用。

我要开始了，啧啧

下面是引入使用Muse-UI的步奏，请应许我开始装逼

让我们NPM安装Muse-UI，然后在mian.js引入import MuseUI from ‘muse-ui’;
import ‘muse-ui/dist/muse-ui.css’; 别忘了使用它Vue.use(MuseUI);如果你需要使用它自带的字体图标，那就再index.html引入谷歌的字体图标
然后我们就可以开始使用Muse-UI进行移动端的开发了，还可以用他的字体图标，但是有个问题这个字体图标库是有点垃圾的，怎么滴我就说他垃圾，你能拿我有什么办法，根本没有法，是不是想打飞我的医保卡？？？

让我们愉快的使用阿里巴巴字体图标

1.让我们去马云爸爸那下个东西
然后解压把这个文件
放在新建的style目录下
然后我们开始使用导航组件，复制代码到你写的页面
然后再用图标的名字
把icon里内容替换成这样
然后再把这个.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
放入对应页面的style就OK了，打完收工。

等一下，如果你不用字体图标而要用图片怎么替换呢？（比如我们公司要用自己的头像，帅的一比)

1
.icon里面还是用 :iconfont icon-tiaoshi ，这就完成了，美滋滋。还有·icon是可以动态绑定的这意味着我们可以切换图片。

mu-bottom-navigation导航组件使用阿里巴巴字体图标的方法,vue使用Muse-UI引入阿里巴巴字体图标的方法相关推荐

在 Nuxt.js 和 Vue.js 项目中引入第三方字体或艺术字
一.需求分析在我们写前端页面的时候,大部分时候是不需要用到第三方字体的,但如果是面向C端的页面,比如宣传页,就有可能会引入第三方字体,主要还是看UI设计师咋想了,此时我们可以通过让UI将特殊字体切成 ...
android上方导航条跳转页面,Native Navigation导航组件的使用说明
目前稳定版本为1.0版本, 2.0是开发版, 暂时不要用. 支持单页直接跳转, 直接自带顶部导航栏配置(返回,标题栏和右侧按钮), 支持直接跳转到多Tab页面, 支持隐藏显示Tab页, 支持数字气泡. ...
vue+elementui项目中引入第三方字体文件的方法示例
# 问题描述: vue中项目,发现相同页面在不同电脑上,字体显示效果不一致,例如:代码中设置了楷体,在某些电脑上显示不是楷体效果. # 解决方案: 1.先下载字体文件所需的.ttf文件(这不很重要,你 ...
安卓Bottom Navigation Activity的自定义使用，即常见错误的处理
初始化底部导航栏首先我们建立一个带有Bottom Navigation Activity项目,新建项目时直接选择Bottom Navigation Activity即可,也可以右键新建Bottom ...
Vue.js之UI组件elementUI——MintUI
目的: 为了提高开发效率功能原则: 拿过来直接使用 vue-cli -> vue-loader bower 前端包管理器 jquery#1.11.1 自动解决依赖 npm node包管理 ...
ionic4 引入外部字体ttf
ionic4 引入外部字体ttf 一般在全局CSS文件variable.scss中添加自定义字体. 第一步:把我们需要引入的字体放到项目的静态资源里面我把字体放到了assets/font文件夹里第 ...
原生小程序之引入 icon字体图标
目录原生小程序之引入 icon字体图标字体图标的配置原生小程序之引入 icon字体图标 icon官网 01:挑选对应的字体图标 02:添加入项目 ( 需要自己创建一个项目 ) 03:点击下 ...
php如何导入字体样式,css怎么引入外部字体？css 字体样式设置的方法（实例）...
在浏览器显示中,页面上不同的字体样式,不仅提升了页面的美观度,也提升了用户的浏览交互性.那么这些不同的字体样式是怎么用css设置的?本章就给大家带来css如何引入外部字体?css 字体样式设置的方法( ...
css引入外部字体的压缩方法，解决网页加载太慢
最近在做网站的时候,发现大多都是常见字体,想用@font-face引入一些特殊的字体,发现文件太大,动不动几十兆,影响网页加载速度,在网上找了半天,发现大多都是使用一款名字为字蛛的字体压缩器,http ...

mu-bottom-navigation导航组件使用阿里巴巴字体图标的方法,vue使用Muse-UI引入阿里巴巴字体图标的方法

好紧张第一次写博客，第一次总是痛并快乐着。?有写的不对的，不欢迎广大网友指正???

我要开始了，啧啧

让我们愉快的使用阿里巴巴字体图标

等一下，如果你不用字体图标而要用图片怎么替换呢？（比如我们公司要用自己的头像，帅的一比)

mu-bottom-navigation导航组件使用阿里巴巴字体图标的方法,vue使用Muse-UI引入阿里巴巴字体图标的方法相关推荐

最新文章

热门文章