设置背景有两种
注意一个是全背景设置,一个是在相应的view内设置背景
这是设置大背景文章来源:https://www.toymoban.com/news/detail-716234.html
<template>
<view class="container">
<image class="bg-img" src="图片路径"></image>
<view class="content"></view>
</view>
</template>
// 以下为 style 区域
.bg-img{
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
}
这是在相应的view内设置view块的背景文章来源地址https://www.toymoban.com/news/detail-716234.html
<template>
<view class="content" :style="{background: 'url('+imageURL+')'}">
<!-- 或者写成:<view class="content" :style="{backgroundImage: 'url('+imageURL+')'}"> -->
</view>
</template>
<script>
export default {
data() {
return {
imageURL: '/static/kkk.png'//图片路径
};
}
}
</script>
到了这里,关于Uniapp设置页面的背景图片的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!