VScode设置编辑器背景图片

最近在知乎上看见有人设置了vscode编辑器的背景图片,觉得很新鲜,就尝试以一下,倒是成功了。

1.首先在vscode扩展中,找到background这个插件,快捷键Ctrl+shift+x

 

2.完成第一步就已经有默认背景了,可是想设置自己喜欢的怎么办?往下看

打开 文件>首选项>设置

在右侧设置里

"background.enabled": true,
"background.useDefault": false,
"background.customImages": [
"file:///D:/like.jpg"
],
"background.style": {
"content": "''",
"pointer-events": "none",
"position": "absolute",
"z-index": "99999",
"width": "100%",
"height": "100%",
"background-position": "center",
"background-repeat": "no-repeat",
"background-size": "100%,100%",
"opacity": 0.1
}

第一句"background.enabled": true,是插件是否启用,当我们把插件下载下来并且重启vscode之后,就已经有了这句话

第二句"background.useDefault": false,是否使用默认图片,改成false,不默认,我们要设置自己想要的!

第三句 设置路径,细心的道友已经注意到了,这是一个数组,也就是说可以设置多张不同的图片!记住,最多三张!  /D:/like.jpg  是图片的路径地址

"background.customImages": [

"file:///D:/like.jpg"

],

最后就是background.style了,大家看着设置就好了,懂点css的都知道。注意后面的"opacity": 0.1透明度是可以设置的。

好啦,到此显示的就是这样子了。

如果你的才华还实现不了你的野心,那就静下心来,埋头苦干。有志者事竟成破釜成舟百二秦关终属楚,苦心人天不负卧薪尝胆三千越甲可吞吴!

此文章转载于 :博客园王小宾

VScode设置背景图的方法如下: 1. 首先,打开VScode并安装扩展插件"background-cover"。你可以在扩展市场中搜索"background-cover"并点击安装。 2. 安装完插件后,打开VScode设置界面。你可以通过点击左下角的齿轮图标,然后选择"Settings"来打开设置界面。 3. 在设置界面中,搜索"background"相关的配置项。根据你提供的引用内容,可以看到有以下几个配置项: - "background.enabled":用于开启或关闭背景图显示。将其设置为true表示开启背景图显示。 - "background.useDefault":用于选择是否使用默认的背景图片。将其设置为false表示使用用户自定义的图片。 - "background.customImages":用于设置用户自定义的背景图片。你可以在这里添加图片的URL地址,最多可以设置三张图片。 - "background.style":用于设置背景图片的样式,包括位置、大小、透明度等。 4. 根据你的需求,修改这些配置项的值。你可以根据引用内容中提供的示例代码来设置背景图片的URL地址、样式等。 5. 设置完成后,保存设置并关闭设置界面。你会发现背景图已经成功显示在VScode编辑器中了。 请注意,以上步骤是基于使用了"background-cover"插件的情况下进行设置的。如果你使用的是其他类似的插件,可能会有略微不同的设置方式。 #### 引用[.reference_title] - *1* [VSCode——设置VSCode背景图片](https://blog.csdn.net/qq_46867640/article/details/117330975)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [vscode 怎么设置背景图片](https://blog.csdn.net/Amouzy/article/details/123247850)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [VScode设置个性化背景](https://blog.csdn.net/m0_60807906/article/details/126456946)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值