起因
心血来潮……因为之前vs、jetbrains全家桶都配置了背景,IDEA中配置是比较容易的
参考文档
作者本人写的文档,比较简略,不过warns里的话告诉我们如何修改了
本插件是通过修改 vscode 的 css 文件的方式运行
所以会在初次安装,或者 vscode 升级的时候,出现以下提示,请选择 【不再提示】:This extension works by editting the vscode's css file.
So, a information appears while the first time to install or vscode update.U can click the [never show again] to avoid it.
所以我们在json配置文件中按照css语法操作即可
官方配置说明
Config 配置项
Name | Type | Description |
---|---|---|
background.enabled |
Boolean |
插件是否启用 If background enabled. |
background.useDefault |
Boolean |
是否使用默认图片 If use default images. |
background.customImages |
Array<String> |
自定义图片,最多 3 个 Your Your custom Images(Max length is 3) |
background.style |
Object |
自定义样式 Custom style |
background.styles |
Array<Object> |
每个图片的独立样式 Style of each image. |
background.useFront |
Boolean |
前景图/背景图。 在代码上面还是下面 true :On the top of code. false : Behind the code |
background.loop |
Boolean |
循环模式,会重复显示图片 loop mode, may repeat your images |
Notice 提示
http 协议的外链图片在当前版本不能使用(vscode 限制),需要用 https 协议开头的外链地址。
You should use protocol https instead of http to the image,which is not support by vscode now.
具体操作
- 以管理员身份运行VS Code,安装background插件
- 打开设置,在搜索框中输入background,选择扩展中的plugin background,选择在setting.json中编辑(ctrl + shift + p -> user setting,所有插件都是同样方法配置)
- 在用户设置中输入以下代码,修改完后按Ctrl+S保存,会提示重启VS Code,点击确定后即可完成修改
//background 的相关配置 https://nosaid.com/article/vscode-background
"update.enableWindowsBackgroundUpdates": true,
"background.customImages": [
"file:////C:/Users/mechrevo/Pictures/Saved Pictures/女孩 狼 ѩ 冬天 绘画.jpg" //图片地址
],
"background.style": {
"content": "''",
"pointer-events": "none",
"position": "absolute", //图片位置
"width": "100%",
"height": "100%",
"z-index": "99999",
"background.repeat": "no-repeat",
"background-position": "50%, 50%",
// 100%, 100%在拉伸时会出现不能铺满的情况, 所以用cover
"background-size": "cover", //图片大小
"opacity": 0.15 //透明度
},
"background.useFront": true,
"background.useDefault": false, //是否使用默认图片
效果如下:
Comments NOTHING