更换VS Code背景图片 - 郑羊羊咩的窝

VS Code设置背景图片稍微有些麻烦，不像IDEA只需要去设置搜索set background image并给这个功能入库设置一个快捷键就可以使用了

首先要装一个叫background的插件，准备图片（最多三张），并记下图片文件的绝对路径

配置settings.json，添加需要的内容，什么你不知道怎么打开？按Cmd+Shfit+P选择打开设置（Windows：Ctrl+Shfit+P）

图片设置，填写图片全路径，只有一张那就复制三次吧，useFront可以控制显示在上层还是下层：

1
"background.customImages": [
2
// "/Users/sparkle/Pictures/照片图库.photoslibrary/originals/D/D45F39A4-954B-470E-9B69-B04E29019ECE.png",
3
"/Users/sparkle/Pictures/照片图库.photoslibrary/originals/9/92414D07-39E2-460B-BB63-8DEBB128F011.png",
4
"/Users/sparkle/Pictures/照片图库.photoslibrary/originals/9/92414D07-39E2-460B-BB63-8DEBB128F011.png",
5
"/Users/sparkle/Pictures/照片图库.photoslibrary/originals/9/92414D07-39E2-460B-BB63-8DEBB128F011.png"
6
],
7
"background.useDefault": false,
8
"background.useFront": true,

下面样式表（css）二选一：

显示在右下角，适合透明小图：

1
"background.style": {
2
"content":"''",
3
"pointer-events":"none",
4
"position":"absolute",
5
"width":"100%",
6
"height":"100%",
7
"z-index":"99999",
8
"background.repeat":"no-repeat",
9
"background-size":"25%,25%",
10
"opacity":0.2
11
},

全屏显示，大背景图：

1
"background.style": {
2
"-webkit-background-size": "cover",
3
"-moz-background-size": "cover",
4
"-o-background-size": "cover",
5
"background-size": "cover",
6
"opacity":0.1
7
},

所有设置重启VS Code生效