微信小程序、前端：背景图片样式拉伸不变形

最新推荐文章于 2023-08-07 17:48:09 发布

Dove言和

最新推荐文章于 2023-08-07 17:48:09 发布

阅读量6.1k

点赞数 1

分类专栏：微信小程序实战全记录前端进阶之路_开启前端web逆袭之路文章标签：背景图片

本文为博主原创文章，未经博主允许不得镜像、转载。

本文链接：https://blog.csdn.net/qq_21041889/article/details/92793543

版权

93 篇文章 151 订阅 ¥9.90 ¥99.00

订阅专栏

34 篇文章 25 订阅 ¥9.90 ¥99.00

订阅专栏

本文介绍了如何在微信小程序中设置背景图片，使其在全屏显示时保持比例拉伸而不变形。通过调整WXML和CSS样式，实现了背景图片的完美适配。

摘要由CSDN通过智能技术生成

wxml:

<image class="lecturer_head"mode="aspectFill"src="XXXX/Public/Uploads/2019-06-18/5d0883e70b422.jpg"></image>

主要是下面四行代码css:

.lecturer_head{
  background: no-repeat center 0rpx;
  background-size: 173rpx 173rpx;
  width: 173rpx;
  height: 173rpx;
}

效果：

关注

专栏目录