聊聊给vscode编辑器设置图片背景的方法

PHP中文网 软件应用

本文摘自PHP中文网，作者青灯夜游，侵删。

本篇文章给大家详细介绍一下给vscode编辑器设置图片背景的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

【推荐学习：《vscode教程》】

先看一个效果展示～

1.png

2.png

方法

为了可随时修改，你可以在你的~/.vscode文件夹下创建一个vscode_style的目录，
在里边放入你自己的css文档和一些图片。以笔者为例,我的vscode的style是

1

2

3

4

5

6

7

8

9

10

11

12

13

14

/**vscode_style.css*/

body{

   pointer-events: auto !important;

   background-size: 100% !important;

   opacity: 0.90 !important;

   background-position: 0 0 !important;

   /**change your image url here*/

   background-image: url('./bg.png');

   content: '';

   position: absolute;;

   z-index: 999;

   width: 100%;

   background-repeat: no-repeat;

 }

然后找到vscode程序文件夹，linux上一般在'/opt'目录下。在{vscode_dir}/resources/app/out/vs/workbench下修改workbench.desktop.main.css就可以修改vscode的样式啦。

1

@import "/home/huaiyu/.vscode/vscode_style/vscode_style.css";

重启vscode就好了,当你重启后发现vscode提醒你your code installation appears to be corrupt,直接忽略就它~

  • 另，如果觉得丑丑的title bar不好看，可以在settings.json添加

1

"window.titleBarStyle": "custom",

可以自己定制标题栏的样式。

更多编程相关知识，请访问：编程视频！！

以上就是聊聊给vscode编辑器设置图片背景的方法的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

值得收藏的12个visual studio code插件

vscommunity与vscode的区别是什么？

vscode编辑器是跨平台的么

如何在vscode终端中执行js代码

vscode用户设置在哪里打开

vscode如何添加本地服务器配置

vscode如何搜索字符串或目录

vscode+vue怎么添加配置

vscode如何编译运行html文件

vscode怎么实现自动添加双引号

更多相关阅读请进入《visual-studio-code》频道 >>



标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...