微信小程序小整理

1、加空格

<text decode="{{true}}" space="{{true}}">
&nbsp;&nbsp;
</text>

ps:在text标签中一定得加上decode="{{true}}"
然后在需要显示空格的地方放&nbsp;


2、如何用阿里巴巴iconfont字体图标

1.打开阿里巴巴iconfont官网(http://www.iconfont.cn/);

2.把用到的字体图标加到项目里面;

3.进入到项目里面,选择font class方式来使用,如果没有生成过代码的同学点生成,已经有代码的直接复制代码;

4.浏览器新建页面,把复制的代码粘贴到地址栏,回车。然后全选页面的内容,复制;、

5.把复制的页面内容粘贴到项目的app.wxss文件
(粘贴到app.wxss,项目里的每个页面都能使用,如果只是某一个页面用到的话,也可以粘贴到对应页面的wxss文件);

6.使用某个字体图标。和网页使用方法一样,习惯在小程序里用的text代替i。

<text class="iconfont icon--jiaoshi"></text>

3、如何使用WeUI
1.项目地址 : https://github.com/weui/weui-wxss/

WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。

2.下载 weui-wxss/dist/style/目录中的weui.wxss即可
下载完成后将weui.wxss文件放到小程序的主目录下:

3.使用:
a.在app.wxss中加入:@import 'weui.wxss';

b.根组件使用 :(页面骨架组件

<view class="page">  
<view class="page__hd"></view>  
</view>  

其他组件以WeUI开头

<view class="weui-footer">HelloWorld</view>  

猜你喜欢

转载自blog.csdn.net/lm1022/article/details/80104892