The key to setting a full-screen background for vue mobile projects is to find the right file and then add the background attribute. The full-screen background mentioned here refers to switching pages at will, and the background is still the same background. Then you can achieve the goal by adding background attributes to the entrance html file or global vue file. Here are two simple ways:
Method 1. Add background attribute to the entry file:
<!DOCTYPE html> <html lang="zh"> <head> <meta></meta> <link></link> <title></title> <script></script> </head> <body> <div ></div> </body> </html> <script> Custom script content </script> <style> html body { //Choose one of the following two background: url('./assets/images/'); //Pictures are used as background background: #0000FF //Solid color for background} </style>
Method 2: Add background attribute to the file:
<template> <div id="app> Customize page content <router-view></router-view> </div> </template> <script> Custom script content </script> <style> #app{ //Choose one of the following two background: url('./assets/images/'); //Pictures are used as background background: #0000FF //Solid color for background} </style>
This is the article about the project practice of setting a full-screen background on vue mobile. For more related content on vue mobile, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!