vue移动端设置全屏背景-蒲公英云

vue移动端设置全屏背景

vue移动端项目设置全屏背景，关键是要找对文件，然后添加background属性即可，这里说的全屏背景，是指任意切换页面，背景都还是这个背景，那么只要在入口html文件或者全局vue文件中增加background属性就能达到目的。以下是简单的两种方式：

法一、在入口文件index.html中添加background属性：

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta></meta>
        <link></link>
        <title></title>
        <script></script>
    </head>
    <body>
        <div id="app"></div>
    </body>
</html>
<script>
    自定义脚本内容
</script>
<style>
html body {
    //以下二者选其一
    background: url('./assets/images/sea.jpg');  //图片做背景
    background: #0000FF                          //纯色做背景
}
</style>

法二、在App.vue文件中添加background属性：

<template>
    <div id="app>
        自定义页面内容
        <router-view></router-view>
    </div>
</template>
<script>
    自定义脚本内容
</script>
<style>
#app{
    //以下二者选其一
    background: url('./assets/images/sea.jpg');  //图片做背景
    background: #0000FF                          //纯色做背景
}
</style>