2021-09-18

Visual Studio Code背景设置的两种方法

第一种方法！

下载background插件！安装即可！
如果要自己设置背景图片的话，在插件的设置里面找到扩展设置，单击进入设置，最后选择在settings.js中编辑代码！保存重新启动编译器即可！

代码:

    "background.customImages": [
        "file:///D:/vscoed/123.jpg ",
        //文件的绝对路径，也可设置相对路径;
        //最多可设置三个路径,以英文逗号分隔,分别对应拆分编译器的三个编译窗口;
    ],
    "background.style": {
        "content": "''",
        "pointer-events": "none",
        "position": "absolute",
        "z-index": "99999",
        "width": "100%",
        "height": "100%",
        "background-position": "center top",//设置背景位置可以是关键字，或者百分比;
        "background-repeat": "no-repeat",//背景平铺，默认是向水平垂直方向平铺，这里设置不平铺no-repeat;
        "background-size": "141%",//背景图片的大小;
        "opacity": 0.1 //设置背景透明度！最大为1，最小为0;
    },
    "background.loop": true,
    "window.autoDetectHighContrast": false,

最终展示结果：

第二种方法

找到Visual Studio Code的安装路径打开，找到workbench.desktop.main.css这个文件，进行编译，在最前面加上以下图片这些代码，这里我设置的是相对路径，所以不用写全局路径注意点，图片在本路径;
这是我的文件路径D:\MicrosoftVSCode\resources\app\out\vs\workbench

相对路径：

绝对路径：
注意点：参数可以看英文执行调整,注意盘符前面是三条斜杠,
代码：

body {
    background-image: url('img.jpg');
    background-size: 100%;
    opacity: 0.7;
    background-repeat: no-repeat;
    }

最终展示结果：