The first training of wechat applet

  Source code ：

<view class="box" hover-class= "boxHover">
  <view class="item" hover-class="itemHover" hover-stop-propagation>1111</view>
</view>
 
<view class="out">
  <text> New visual training base </text>
  <text> Wechat applet course </text>
</view>

<view class="out">
  <text> New visual training base </text>
  <text> WeChat <text decode> &nbsp; &lt; </text> Applet course </text>
</view>

<scroll-view scroll-x>
  <view class="scrOut">
    <view class="scrBox">111</view>
    <view class="scrBox">222</view>
    <view class="scrBox">333</view>
    <view class="scrBox">444</view>
    <view class="scrBox">555</view>
  </view>
</scroll-view>

<scroll-view class="scroll2" scroll-y  scroll-top="150">
  <view class="scrOut2">
    <view class="scrBox2">111</view>
    <view class="scrBox2">222</view>
    <view class="scrBox2">333</view>
    <view class="scrBox2">444</view>
    <view class="scrBox2">555</view>
  </view>
</scroll-view>

<view>
  <navigator class="link" url="/pages/logs/logs" open-type="reLaunch"> Jump to log </navigator>
  <navigator class="link" url="/pages/logs/logs"> Jump to log </navigator> 
</view>


<image src="http://www.qingnian8.com/images/hot1.jpg" ></image>
<image class="img1" src="/images/img4.jpg" mode= "bottom right" ></image>
<image src="/images/img1.jpg" show-menu-by-longpress></image>
<image src=" /images/img3.jpg" mode= "widthFix" ></image>


<text selectable space="ensp"> New visual training base new visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base visual training base </text>
<view> Wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat applet development wechat character development wechat applet development </view>

.box{ width: 100px; height: 100px;background: red;}
.boxHover{ background: yellowgreen;}

.item{ width: 50px; height: 50px; background: gold;}
.itemHover{ background:  hotpink; }

/* .out view{color:blue; display: inline;} */

image{width:100%;}
.link{ height: 40px;}
.scrOut{ border:1px solid green; display: flex;flex-wrap: nowrap;}
.scrBox{ width:100px; height: 100px; background: gold ; margin-right: 2px;flex:0 0 100px;}

.scroll2{ height: 450px;}
.scrBox2{ width:100%; height: 100px; background: pink ; margin-bottom: 1px;}