前端基础学习-VS code修改主题颜色与背景

闲来无事想修改一下vscode的颜色主题还有背景，这里做一个小的记录

方法一

1、修改主题

我这里是中文版，英文的对应选择就好

文件>首选项>颜色主题
选择对应的主题

2、添加背景

1. 安装插件
   

2. 文件>首选项>设置
   搜索plugin background
   

3. 点击在settings.json中编辑
   对应的地方修改成自己需要的样式即可
   

{
    "editor.renderIndentGuides": false,
    "vetur.validation.template": false,
    "git.confirmSync": false,
    "editor.fontSize": 18,
    "editor.tabSize": 2,
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "background.useFront": true,
    "background.useDefault": false,
    "background.customImages": [
        "file:///C:/pictures/000904-16077029445e88.jpg"//图片地址
    ],
    "background.style": {
        
        "content": "''",
        "pointer-events": "none",
        "position": "absolute",
        "z-index": "99999",
        "width": "100%",
        "height": "100%",
        "background-position": "100% 100%",
        "background-repeat": "no-repeat",
        "background-size":"100%,100%",
        "opacity": 0.1
    },
    "workbench.colorTheme": "Solarized Light"
}

注意

    "background.useFront": true,
    "background.useDefault": false,

是必须的

4. 保存并且重新打开即可生效

方法二

1、安装插件background-cover

这个是设置一张图片全部覆盖vscode

2、输入命令启动插件

ctrl + shift +p 输入命令

backgroundCover - start

根据自己的需要选择背景图片
也可以设置不透明度

注意

当我们重新打开vscode会发现报错不支持文件，文件顶部会出现不受支持的提示
这是因为我们改变了vscode的核心文件，我们现在只需要下载Fix VSCoode Checksums的插件

安装成功后
我们需要打开 查看>命令面板（或者ctrl+shift+p），然后输入

Fix Checksums: Apply

用来检查核心文件的更改并应用新的校验

ps
另外如果出现问题，我们需要输入

Fix Checksums: Restore

还原vscode checkums这个插件的原始状态