微信小程序实现文字在图片的正中间(试用各个机型)

视图页面

<view class="image-parent"> <image src="wwww.jpg" mode="aspectFill" class="image"></image> <view class="child">child</view> </view>

 

CSS样式

.image-parent {
  position: relative;
}

.image {
  width: 100%;
}

.child {
  width: 100px;
  height: 24px;  
  position: absolute;
  left: 0;
  top: 0px;
  right: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
}  

效果图如下

微信小程序实现文字在图片的正中间(试用各个机型)


————————————————
版权声明:本文为****博主「Emma&#039;」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.****.net/w18838020329/article/details/105223891