VsCode 概览尺、装订线、代码块高亮设置

一、概览尺设置

json 复制代码
{
    "workbench.colorCustomizations": {
        // 概览尺中git标识颜色
        "editorOverviewRuler.addedForeground": "#29e041",
        "editorOverviewRuler.modifiedForeground": "#34a3ff",
        "editorOverviewRuler.deletedForeground": "#e02551",

        // 行号右侧git装订线的颜色
        "editorGutter.addedBackground": "#29e041",
        "editorGutter.modifiedBackground": "#34a3ff",
    },
}
  • 概览尺
    • 编译器区域最右侧的滚动条就是概览尺了;
  • 概览尺宽度(垂直滚动条)

装订线设置

  • 装订线
    • 当我们的项目处于git托管时,我们修改代码的时候,会在行号右侧有关于【新增(绿色长方形)、修改(蓝色带有条纹的长方形)、删除(红色箭头)】的标识,这就是装订线了;
  • 装订线宽度

代码块高亮设置

  • 在 webstorm 中,当我们的光标点击某一块代码的时候,会有线条框选这个代码块;
  • vscode 中此设置默认是没有开启的,需要我们手动开启;
  • 开启之后的效果:
    • 图中黄色线条:
相关推荐
木斯佳34 分钟前
前端八股文面经大全:携程前端一面(2026-04-17)·面经深度解析
前端·状态模式
Java后端的Ai之路40 分钟前
LangChain ReAct Agent 核心技术问答
前端·react.js·langchain
码喽7号1 小时前
Vue学习七:MockJs前端数据模拟
前端·vue.js·学习
NotFound4861 小时前
探究分享从对话到执行:OpenTiny NEXT 如何重塑前端智能化开发范式
前端
小满zs2 小时前
Next.js精通SEO第二章(robots.txt + sitemap.xml)
前端·seo
kyriewen2 小时前
你的首屏慢得像蜗牛?这6招让页面“秒开”
前端·面试·性能优化
算是难了3 小时前
Nestjs学习总结_3
前端·typescript·node.js
yogalin19933 小时前
如何实现一个简化的响应式系统
前端
kyriewen113 小时前
项目做了一半想重写?这套前端架构让你少走3年弯路
前端·javascript·chrome·架构·ecmascript·html5