前言

做过web开发的都知道HTML，在HTML中使用最多的就是div标签，它是一个容器，可以装一些东西，然后通过布局可以构建一个很美的界面web界面。而在微信小程序中想要构建一个界面出来使用的是WXML，它给我们提供了功能更加强大的组件如：view，button，text等，微信小程序团队将很多我们平时在HTML中用到的标签集成在了一个组件里，很方便，🆗话不多说，现在就来聊聊view的使用！

初识View

1.使用方法

上文说到div是HTML中用到最多的标签，view标签也是小程序中用到最多的标签，所以很重要！！！其实<view>标签可以看作是<div>标签来使用，因为它们的作用基本上一致，所以也很好理解了！使用的方法也基本一样，就是使用开始标签<view>和结束标签</view>将内容包起来就行，如下图：

wxml代码

<!--输出hello world-->

<view class="container">   <!-- class是样式类-->
  hello world
</view>

运行结果预览

2.直观感受

通过改变样式来更加直观的感受一下view到底是什么样子的
css代码

.container{
  height: 500rpx;
  background-color: red; 
}
.container1{
  width: 400rpx;
  height: 400rpx;
  background-color: green;
}
.container2{
  background-color: blue;
}

wxml代码

<view class="container">
  hello world
</view>
<view class="container1">
  hello world
</view>
<view class="container2">
  hello world
</view>

运行结果预览

可以看到当没有设置宽度和高度的时候，view默认的宽度是100%，而高度是根据内容来决定的，也就是说是有内容来撑开的，当设置了宽，高以后，就像我们熟悉的<div>

嵌套使用

wxml代码

<view class="container">
  <view class='Box_son'>
    <view class='Box_grandson'> </view>
  </view>
</view>

运行结果预览

view的嵌套其实也很简单，但是通过嵌套我们可以做很多的事情，小程序每一个界面都是一个一个的view嵌套组成的，当然这里的嵌套不只是view，view标签还可以嵌套很多的其他标签，<text>,<image>等等

结束语

这篇文章只是简单的简绍了一下，view的用法和嵌套，并没有讲布局知识，我的初衷就是想让更多想学习小程序的同学，以最简单的方式入门。所以可能有很多的不足之处，请大家多多在评论区指教。
当然如果觉得我写的还可以，就点个赞呗！！哈哈哈