Get the App
SLTechnology News&Howtos  ›  Internet Technology  › 

How to set the background of a picture by vscode editor

Shulou Source: shulou.com Published: 2022-06-02 12:31:56 10月21日 Update

This article will explain in detail how to set the picture background in the vscode editor. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

What is the use of vscode Visual Studio Code is a cross-platform editor for writing modern web and cloud applications, which runs on OS X web Windows and Linux. It provides developers with built-in support for a variety of programming languages, and as Microsoft pointed out in keynote at the Build conference, this editor also provides rich code completion and navigation features for these languages.

In order to modify it at any time, you can create a vscode_style directory under your ~ / .vscode folder

Put your own css document and some pictures in it. Take the author as an example, the style of my vscode is

/ * * vscode_style.css*/body {pointer-events: auto! important; background-size: 100%! important; opacity: 0.90! important; background-position: 00! important; / * * change your image url here*/ background-image: url ('. / bg.png'); content:''; position: absolute;; z-index: 999; width: 100%; background-repeat: no-repeat;}

Then find the vscode program folder, which is usually under the'/ opt' directory on linux. You can modify the style of vscode by modifying workbench.desktop.main.css under {vscode_dir} / resources/app/out/vs/workbench.

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

Just restart vscode. When you restart it, you will find that vscode reminds you of your code installation appears to be corrupt. Just ignore it.

In addition, if you think the ugly title bar is not good-looking, you can add it in settings.json

"window.titleBarStyle": "custom"

You can customize the style of the title block yourself.

This is the end of this article on "how to set the picture background in the vscode editor". I hope the above content can be helpful to you, so that you can learn more knowledge. if you think the article is good, please share it out for more people to see.

Tags: Editors pictures articles backgrounds files folders more styles directories languages good practical bad code content functions multiple conferences developers documents Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Microsoft MySQL NVidia Shulou Tech Info Docker