vs code窗口透明和设置背景图

linux  版本

 

1. 首先下载插件GlassIt-VSC

2. 进入设置页面：按F1 ，搜索打开工作区设置，进入设置页面后搜索glassit.alpha，然后就可以设置透明度了.

【快捷键：透明度提高(Ctr + Alt +Z)，透明度降低(Ctr + Alt +C)】

 

windows 版本

1.vscode编辑设置窗口透明

• 首先要在vs code的应用商店里面下载一个插件Windows opacity，然后安装插件Windows opacity。
• 安装完成之后在设置里面搜索winopacity.opacity,会出现一个窗口，数值越小越透明，范围实在0-255，然后就实现窗口透明效果了。

  

  image.png

2.vscode窗口设置背景图

+首先也要下载一个插件background，然后在设置里面搜索background，选择在setting.json中设置。

image.png

将代码复制粘贴进去就好了，图片地址记得改成自己喜欢的图片地址。

 

    "git.ignoreMissingGitWarning": true,
    "window.zoomLevel": 0,
    "explorer.confirmDelete": false,
    "files.autoSave": "onWindowChange",
    "files.autoSaveDelay": 0,
    "update.enableWindowsBackgroundUpdates": true,
    "background.customImages": [
        "file:///D:/pic/123.jpg"//图片地址
    ],
    "background.style": {
        "content":"''",
        "pointer-events":"none",
        "position":"absolute",//图片位置
        "width":"100%",
        "height":"100%",
        "z-index":"99999",
        "background.repeat":"no-repeat",
        "background-size":"100%,100%",//图片大小
        "opacity":0.2 //透明度
    },
    "background.useFront": true,
    "background.useDefault": false,//是否使用默认图片
    "liveServer.settings.donotShowInfoMsg": true,
    "workbench.colorTheme": "Monokai",
    "editor.quickSuggestions": {
        "strings": true
    },
    "[javascript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features"
    },
    "winopacity.opacity": 240 //设置窗口透明度。
}

最终效果

 

image.png