小程序视图view重叠展示示例

类似如图背景图片底部显示半透明文本view：

image

.wxml

    
      
      
        MISS时尚穿搭教程
        192人观看
      
    

.wxss

.special-topic {
  width: 100%;
  height: 350rpx;
  display: flex;
  /* 从最下面开始布局 */
  align-items: flex-end; 
  background: whitesmoke;
  position: relative;
}

.special-topic-content {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  height: 80rpx;
  background: rgba(0, 0, 0, 1);
  opacity: 0.4;
  align-items: center;
  position: absolute;
}

要点： 父视图的position: relative; 重叠放置在父视图上的视图postion: absolute。