因为background:fix在手机端有兼容性的问题
用这个办法解决
<div class="content"> <div class="background-image" :style="{ backgroundImage: `url(${resource.head[lang]})`}"></div> </div>
把背景图这个div单独拿出来,在less里这样子
.back-image(@url) { background-size: 100% 100%; background-repeat: no-repeat; background-image: url(@url); } .content { overflow: auto; position: relative; } .background-image { position: fixed; top: 0; left: 0; bottom: 0; right: 0; width: 100%; z-index: -1; background-repeat: no-repeat; background-size: cover; }