复制 使用本地路径背景图片需注意:.test2{background-image:url('~@/static/logo.png');} 为方便开发者,在背景图片小于 40kb 时,uni-app 编译到不支持本地背景图的平台时,会自动将其转化为 base64 格式; 图片大于等于 40kb,会有性能问题,不建议使用太大的背景图,如开发者必须使用,则需自己将其转换为 base...
background-image: url('/static/img/startUpHeader02.png'); background-position: left top; background-repeat: no-repeat; background-size: cover; } } .banner_box .h6 { text-align: center; line-height: 96rpx; font-size: 36rpx; color: #fff; font-weight: bold; } .banner_box .conter...
.test{background-image:url('@/static/index/no-content.png');}// 经常 vite:css 转化后 .test{background-image:url("__VITE_ASSET__8a6b759d__");}// 映射{'8a6b759d'=>'static/index/no-content.png'} 实际上,最终编译成的小程序.ttss文件是这样的: .test{background-image:url("../.....
/* left: 40rpx; width: 84%;border-radius: 15px; background-size: cover; background-repeat: no-repeat;*/ z-index: 3; padding: 40rpx; background-image: url("~@/static/sandian.png"); height: 600rpx; } .txtcenter { width: 428rpx; font-family: PingFangSC-Regular; font-weight: ...
/* 绝对路径 */@importurl('/common/uni.css');@importurl('@/common/uni.css');/* 相对路径 */@importurl('../../common/uni.css');/* 绝对路径 */background-image:url(/static/logo.png);background-image:url(@/static/logo.png);/* 相对路径 */background-image:url(../../static/logo...
使用background-image背景图属性引入 1.官方文档说:支持 dase64 格式图片。 支持网络路径图片。40kb以下小图片推荐使用以 ~@ 开头的绝对路径;大图片推荐使用网络地址 。微信小程序不支持相对路径(真机不支持,开发工具支持) /* 推荐~@绝对路径引入 */background-image:url("~@/static/images/home/home_bg.png")...
@import url('../../common/uni.css'); 1. 2. 3. 4. 5. css 文件或 style 标签内引用的图片路径,可以使用相对路径也可以使用绝对路径,形式如下: /* 绝对路径 */ background-image: url(/static/logo.png); background-image: url(@/static/logo.png); ...
/* 绝对路径 */background-image: url(/static/logo.png);background-image: url(@/static/logo.png);/* 相对路径 */background-image: url(../../static/logo.png); Tips 引入字体图标请参考,字体图标 @开头的绝对路径以及相对路径会经过 base64 转换规则校验 ...
text-align: center; border-radius: 10rpx; position: absolute; right: 0; } 7.uinapp 进度条 加渐变色 .wx-progress-inner-bar { border-radius: 6px !important; background-image: linear-gradient(to right, #f83600 0%, #f9d423 100%); } 小程序码...
pathToBase64('/static/image.png').then(data => { console.log(data); this.pageBg= data; }) }, 1. 2. 3. 4. 5. 6. 7. 4、然后return一下数据,把背景css写入html上即可。 <template> <view :style="'background: url('+backImg+') no-repeat center center;background-size: cover;'"...