微信小程序font图标下载及是用方法

2017-12-05

导读：2017年6月14日，微信小程序font图标已经是当下最热门的话题，下面将从多方面来谈谈微信小程序font图标相关的内容。...

微信小程序font图标已经是当下最热门的话题，下面将从多方面来谈谈微信小程序font图标相关的内容。

下载font-awesome字体包

打开Transfonter网站，上传字体fontawesome-webfont.ttf（理论其它文件格式也可以转换，并未尝试），选择base64编码，convert后下载
下载得到的包中有style文件，打开后获得以下代码，并对照font-awesome.css中的内容，加入到微信小程序的app.wxss文件中

@font-face {

font-family: 'fa';

src: url(data:font/truetype;charset=utf-8;base64,AAEAAAANAIAAAwBQRkZUTXLOMIUAAlXMAAAAHEdERUYAJwKrAAJVrAAAAB5PUy8yiDJ6IwAAAVgAAABgY21hcJ0vdNQAAAw4AAADAmdhc3D//wADAAJVpAAAAAhnbHlmHejPwQAAGdQAAh3kaGVhZAbB4eAAAADcAAAANmhoZWEO+QqbAAAB......long long) format('truetype');

font-weight: normal;

font-style: normal;

}

.fa {

font-family: "fa" !important;

font-size: 16px;

-webkit-font-smoothing: antialiased;

-webkit-text-stroke-width: 0.2px;

}

/* makes the font 33% larger relative to the icon container */

.fa-lg {

font-size: 1.33333333em;

line-height: 0.75em;

vertical-align: -15%;

}

.fa-2x {

font-size: 2em;

}

//long long long...........

然后在小程序中使用class="fa fa-user"即可，如<text class="fa fa-user"></text>

微信小程序商城系统开发其实很简单

微信小程序商城系统开发其实很简单，只需要五步就可以完成，整个过程包括开发、上线、发布都可以轻松搞定...详情

第二部分：如何开通一个小商店

微信小程序font图标下载及是用方法

微信小程序商城系统开发其实很简单