1 引言

刚接触小程序，会有很多错误的思路去编写，为了避免在代码方面出错，本文将对前端和小程序做一个区分。

2 问题描述

微信小程序与web前端的区别。

3 算法描述

在web的html中我们一般都是使用div、p、pan、a等标签来制作页面，但是在微信小程序中就是使用了view、text、image等来制作小程序，在两者转换中我们可以把view标签当作html里面的div标签，image和html中的img一样，小程序里的wxml就和body类似,wxss就和css类似，用来定义标签的属性等。

4 结语

这次区分了html与小程序之间的差异，可以避免在使用标签出现错误的代码。

附件

wxml:
<view class="navbar">
 <lable wx:for="{{navbar}}"
 data-idx="{{index}}"
 class="item {{currentTab==index ? 'active' : ''}}"
 wx:key="unique"
 bindtap="navbarTap">{{item}}
 </lable>
</view>
wxss:
page{
 display: flex;
 flex-direction: column;
 height: 100%;
}
.navbar{
 flex: none;
 display: flex;
 background: #fff;
}