vscode 修改标签栏样式为换行全部展示
目前vscode的标签栏是滚动式的,选择查看都不是很方便,于是想要搞成andriod studio那种换行全部展示的标签栏。
因为vscode是electron写的,因此修改css就可以实现。
修改方法
1. 安装Custom CSS and JS Loader插件
2. 添加文件/Users/zmj/.vscode/tabs-wrapper.css
.title {
height: auto !important;
}
.tabs-and-actions-container {
display: block !important;
height: auto !important;
}
.tabs-and-actions-container .monaco-scrollable-element {
height: auto !important;
}
.tabs-container {
overflow: initial !important;
height: auto !important;
display: flex !important;
flex-wrap: wrap !important;
}
.tabs-and-actions-container .editor-actions {
position: fixed !important;
right: 0 !important;
z-index: 20 !important;
bottom: 20px !important;
background: #222 !important;
}
3. 在settings.json中添加:
"vscode_custom_css.imports": [
"file:///Users/zmj/.vscode/tabs-wrapper.css"
],
"vscode_custom_css.policy": true,
4. cmd+shift+p呼出命令框,输入命令Reload Custom CSS and JS
5. 重启vscode
6. 完成!
vscode 修改标签栏样式为换行全部展示的更多相关文章
- Android spinner默认样式不支持换行和修改字体样式的解决方法
在spinner中显示的数据过多,需要换行,而Android自身提供的android.R.layout.simple_spinner_dropdown_item样式不支持换行,因此参考android提 ...
- echars line 底部图例强制不换行(滚动),修改图例样式
{ grid: { left: '5px', right: '10px', top: '10px', bottom: '40px', containLabel: true }, tooltip: { ...
- JS笔记一:动态修改css样式
---恢复内容开始--- 最近在学习CSS/JS的样式,两个合学习一起学习,加深JS的书写和了解. 一.通过Javasript修改图片大小 通过函数来传递图片id,height,width,使用doc ...
- ASP.NET中直接用C# 动态修改CSS样式
ASP.NET中直接用C# 动态修改CSS样式 wonsoft (wonsoft@163.com) 使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个B ...
- MFC学习 修改窗口样式
1. 在PreCreateWindow中可用CREATESTRUCT cs, cs.lpszName修改窗口标题, cs.lpszClass = AfxRegisterWndClass 修改图标与样式 ...
- js介绍,js三种引入方式,js选择器,js四种调试方式,js操作页面文档DOM(修改文本,修改css样式,修改属性)
js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...
- vue-cli —— 局部修改Element样式
最近在做vue项目时用到了Element,发现这玩意儿用起来很舒服,很新颖,上手也很快,而且效果足够酷炫.但是后面发现一个很大的问题,那就是Element的样式有限,这极大地限制了项目的应用广度,所以 ...
- vue修改框架样式/deep/
/deep/ 父元素的样式名 /deep/ 要修改的样式名 使用 ... 貌似不行
- 【转】如何修改 video 样式
我们这里说的“修改 video 样式”并不是要自己实现一套 controls,而是尝试修改 video 的默认样式 隐藏全屏按钮 这个很容易查到 video::-webkit-media-contro ...
随机推荐
- 让.NetCore程序跑在任何有docker的地方
一.分别在Windows/Mac/Centos上安装Docker Windows上下载地址:https://docs.docker.com/docker-for-windows/install/(wi ...
- 【雕爷学编程】Arduino动手做(64)---RGB全彩LED模块
37款传感器与执行器的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止这37种的.鉴于本人手头积累了一些传感器和执行器模块,依照实践出真知(一定要动手做)的理念,以学习和交流为 ...
- Blazor WebAssembly 3.2 正式发布
5月 20日,微软 发布了 Blazor WebAssembly 3.2(https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0- ...
- 最香远程开发解决方案!手把手教你配置VS Code远程开发工具,工作效率提升N倍
文章每周持续更新,原创不易,「三连」让更多人看到是对我最大的肯定.可以微信搜索公众号「 后端技术学堂 」第一时间阅读(一般比博客早更新一到两篇) 今天和大家分享远程开发工具,分享一下我平常是如何用 V ...
- Appium自动化(15) - 针对 webview 进行自动化测试
如果你还想从头学起Appium,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1693896.html webview 简介 WebVie ...
- poj3308 最小点权覆盖
Paratroopers Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 8837 Accepted: 2663 Desc ...
- jdk8 Collections#sort究竟做了什么
前言 Collections#sort 追踪代码进去看,会调用到Arrays.sort,看到这里时,你肯定会想,这不是很简单,Arrays.sort在元素较少时使用插入排序,较多时使用快速排序,再多时 ...
- Java中的集合(十二) 实现Map接口的WeakHashMap
Java中的集合(十二) 实现Map接口的WeakHashMap 一.WeakHashMap简介 WeakHashMap和HashMap一样,WeakHashMap也是一个哈希表,存储的也是键值对(k ...
- CSS用户自定义样式
在浏览器中打开前面写的例子页面,你会发现 <strong> 元素中的文字会比其他文字粗一些.这些样式就是在浏览器定义的默认HTML样式. 而<strong> 元素是红色的,这是 ...
- 如何管理win系列服务器,win10 pro如何 使用远程桌面
远程桌面,大家都理解,专业的运维人员都是连接上百台服务器进行操作管理工作. 先介绍一款专业的远程桌面管理工具:iis7远程桌面批量管理 win10 pro如何 使用远程桌面? 一. 首先在win10 ...