vscode 全透明背景图
一.前言
08.02更新:已魔改插件 可以直接下载插件使用了
10.18跟新:已发布到vscode扩展,直接搜索“background-cover”进行安装使用 下载地址

下载后手动安装就ok了,具体配置安装后点开插件有说明的!!!
今天看到了博客园 这篇文章 后 Visual Studio 2017 设置透明背景图 ,琢磨了下难道vscode不行吗。。
vscode目前有一个设置背景的插件 background 不过并不是整个界面显示,有点美中不足,所以就先下载了这个插件的源码,发现是改了其中一个css文件实现的,
本来想改下源代码重新发个包的,不过刚研究vscode插件没多久,改的话需要点时间。干脆直接改css替换下也挺方便的。有时间在改代码吧。。
先来个效果图。。


二.修改设置
"window.titleBarStyle": "custom",//首先把标题栏改为非原生的
三.获取css文件路径
一般都是在安装目录下 文件名:workbench.main.css
C:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench\workbench.main.css
或者打开开发人员工具查看 复制css地址


四.修改css样式
将下面css样式 追加到 workbench.main.css 文件里就行了,css样式也可以自己增加修改,,别忘记替换图片路径噢。。。
/*background start*/
body{pointer-events:auto !important;background-size:100% !important;opacity: 0.93 !important;background-position: 0 0 !important;background-image: url('file://E:/OneDrive/Pictures/overwatch/bg-53.jpg') !important;content:'';position:absolute;z-index:99999;width:100%;background-repeat:no-repeat;}
/*background end*/
end....
觉得好用点个赞呗。。欢迎来我们vscode群(376553669)尬聊
vscode 全透明背景图的更多相关文章
- VS2013 图片背景·全透明背景图(转)
Note: 1.xaml编辑器和个别的编辑器(如HTML的)因为是承载在VS的一个子窗口上,所以背景依然是黑色的. 2.该背景必须在VS实验环境下使用. 效果图: 1.准备工作 1.先准备Visual ...
- CSS之全屏背景图
吐槽啦:Yeah 明天就是国庆了o(* ̄▽ ̄*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言 ...
- 【学习进步之路】-【浏览器兼容】透明背景图IE、360浏览器不兼容
最近在项目中遇到了浏览器兼容问题,透明背景图在IE或360兼容模式下没有效果,以前都是网上搜到结果,直接用了,并没有深入的去理解和利用,总会在下一次使用的时候忘记.为了让自己在前端方面学习更有成效,想 ...
- Visual Studio 2017 设置透明背景图
一.前言 给大家分享一下,如何为VS2017设置透明背景图.下面是一张设置前和设置后的图片. 设置前: 设置后: 二.设置背景图片的扩展程序 我们打开VS的扩展安装界面:[工具]->[扩展和更新 ...
- 2022最新最详细必成功的在Vscode中设置背景图、同时解决不受支持的问题
文章目录 1.效果展示 2.设置背景图的详细步骤 2.1 .下载background插件 2.2 .选择扩展设置 2.3 .在setting.json中编辑 2.4.对应的配置文件 2.5 .重启电脑 ...
- IE6兼容透明背景图
JS代码: <!--[if IE 6]><script src="~/Scripts/UI/DD_belatedPNG.js"></script> ...
- CSS实现响应式全屏背景图
body { /* 加载背景图 */ background-image: url(images/background-photo.jpg); /* 背景图垂直.水平均居中 */ background- ...
- 全屏背景图的实现及background的相关属性
今天需要做一个占满设备宽度的轮播图,这里作为demo仅展示一张图,下面分别是要操作的图片(这里做了缩放处理,实际的图比较大),以及要实现的效果图,很明显两者是不成比例的: (图一) ...
- css设置全屏背景图,background-size 属性
在写主题样式的时候经常会碰到用背景图铺满整个背景的需求,这里分享下使用方法 需要的效果 图片以背景的形式铺满整个屏幕,不留空白区域 保持图像的纵横比(图片不变形) 图片居中 不出现滚动条 多浏览器支持 ...
随机推荐
- springMvc返回Json中自定义日期格式
(一)输出json数据 springmvc中使用jackson-mapper-asl即可进行json输出,在配置上有几点: 1.使用mvc:annotation-driven 2.在依赖管理中添加ja ...
- springMVC框架下返回json格式的对象,list,map
原文地址:http://liuzidong.iteye.com/blog/1069343 注意这个例子要使用jQuery,但是jquery文件属于静态的资源文件,所以要在springMVC中设置静态资 ...
- JS解析json数据(如何将json字符串转化为数组)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD ...
- TensorFlow基础(三)激活函数
(1)激活函数 激活函数(Activation function)并不是指这个函数去激活什么,而是指如何把“激活的神经元的特征”通过函数把特征保留映射出来.对输入信息进行非线性变换. 线性模型的最大特 ...
- selenium基础知识(概述、安装、IDE等)
参考http://www.yiibai.com/selenium/selenium_webdriver.html
- 使用腾讯云mysql的一下小坑
1. 数据库中标的命名,mybatis会给你全部转成驼峰命名,这样就会发现找不到数据库的表了.比如下面的,我在本地运行时ok, 表名称是t_blogtype,但是放到服务器就报错说找不到表. 2. 本 ...
- 【Java】使用Atomic变量实现锁
Atomic原子操作 在 Java 5.0 提供了 java.util.concurrent(简称JUC)包,在此包中增加了在并发编程中很常用的工具类 Java从JDK1.5开始提供了java.uti ...
- Vue--- vue-cli 脚手架 安装 -reeber
vue-cli 脚手架 安装 一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命 ...
- ES5 实现 ES6 的 class以及extends
ts中是这样的 class Greeter { greeting:string; constructor(message:string){ this.greeting = message; } gre ...
- WebGL学习笔记(1)
基本的WebGL图形操作(详细参考教程:https://www.yiibai.com/webgl,需要1周左右熟悉webgl的对象方法以及着色器代码):绘制三角形 drawElements gl.TR ...