微信小程序-uniapp-vue3前端开发-本地设置为全屏背景图

page.json文件中跳转时去掉头部导航栏样式

{
	"path": "pages/login/login",
	"style":{
		"navigationStyle": "custom"
	}
}

使用<image/>标签指定图片位置

<view class="content">
	<image class = "background-image" src="@/static/background/loginback.png"/>
	<view class="con-container">
		<view class="head-text1">
			<span>登录</span>
		</view>
	</view>
</view>

 在样式中指定一个固定高度并且使用position:absolute

.background-image{
	  width: 100%;
	  height: 1625rpx;
	  position:absolute;
}
.con-container{
	position: absolute;
	width: 100%;
	height: 1300rpx;
	margin-top: 230rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.head-text1{
	width: 70%;
	height: 100rpx;
	margin-top: 100rpx;
	font-size: 70rpx;
	letter-spacing: 10rpx;
	color: white;
}

其他内容则正常编写就可以