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


本文摘自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编辑器设置图片背景的方法的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

vscode远程调试node程序的方法介绍

vscode怎么快速删除空格

vscode不能补全标签怎么办

vscode无法搜索插件

vscode中配置和使用java的方法

20+前端常用的vscode插件(总结推荐)

vscode开启智能提示

vscode插件安装在哪

vscode怎么添加背景

vscode怎么切换到bash

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



打赏

取消

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

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

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

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

评论

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