Muse UI 样式

Muse UI的icon是国外网站，被墙了所以用这个网址的icon，在index.html文件中引入下面链接：

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic">

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

Muse UI国外网站查看icon

https://www.material.io/tools/icons/?style=baseline

Muse UI 引用阿里巴巴矢量图标

阿里巴巴矢量图标官网：http://www.iconfont.cn/

进入官网寻找需要的图标 - 加入购物车 - 添加至项目 - 下载至本地 - 将iconfont.css文件拷贝到项目中 - 在index.html中引用样式

    

代码：与以往不同的是需要加属性value，<mu-icon value=":iconfont icon-dizhi1"></mu-icon>  或者直接写<i class="iconfont icon-dizhi1"></i>

<template>

    <div>

        <mu-appbar class="mu-appbar-color">

          <div slot="left">

              <span>厦门</span>

              <mu-icon value=":iconfont icon-dizhi1"></mu-icon>

          </div>

          <div >1</div>

          <div slot="right">1</div>

        </mu-appbar>

    </div>

</template>