005.小程序-基础布局容器 view、text

 

基础布局容器

view

<!-- view  阻止冒泡
  点击效果只会影响子元素，不会受父元素影响
-->
<view class="box" hover-class="boxHover"  >
  <view  class="item" hover-class="itemHover" hover-stop-propagation > 1 </view>
</view>
<view>---</view>
<!-- 按住后多久出现点击态 -->
<view class="box" hover-class="boxHover"  hover-start-time="10000" >22</view>
<view>---</view>
<!-- 手指松开后点击态保留时间，单位毫秒 -->
<view class="box" hover-class="boxHover"  hover-stay-time="10000" >22</view>

 

 

/* pages/demo/demo.wxss */
.box{
  background: red;
  width: 100rpx;
  height: 100rpx;
}
.boxHover{
  background: green;

}

.item{
  background: gold;
  width: 50rpx;
  height: 50rpx;

}

.itemHover{
  background: pink;
 

}

 

 

 

 点击

 

text

<!-- user-select 文字可选  ensp    中文字符空格一半大小 -->
<text user-select="true" space="">5  55</text>