当前位置：首页 > article >正文

修改 vscode 左侧导航栏的文字大小（更新版）

article 2025/9/16 14:56:27

1. 起因，目的:

问题： vscode 左侧的文字太小了！！！
我最火的一篇文章，写的就是这个问题。看来这个问题，是很广泛的一个痛点。
我最近更新了 vscode，这个问题又出现了。再来搞一下。
编程工具很关键的。个人的工具，美观，实用，提升效率， 防止火爆脾气。

2. 先看效果

此时能实现，左侧和右边的文字一样大。
请添加图片描述

请添加图片描述

3. 过程:

详细聊天过程，修改步骤，在这里。

3.1 vscode 修改左侧导航栏的文字大小

个性化设置

安装 “Custom CSS and JS” 扩展（如果尚未安装）。
ctrl + shift + p，运行:

Enable Custom CSS and JS
启用自定义样式, 这一步，很关键！后面修改之后 css 之后，也是再来一遍。
ctrl + shift + p, 输入 settings.json

找到自定义的 css 文件，没有的话，就新建一个

  "vscode_custom_css.imports": ["file:///C:/Users/Administrator/custom-vscode.css"],

这个 css 写上：

/* 调整左侧导航栏（Explorer）的字体大小 *//* 原来的写法 */
/* 聊天记录: https://x.com/i/grok?conversation=1928671798994022793   *//* vscode 更新之后，新的的写法 *//* 调整左侧导航栏（资源管理器）中文件和文件夹名称的字体大小 */
.monaco-workbench .part.sidebar .monaco-list .monaco-list-row .monaco-highlighted-label {font-size: 21px !important;
}

最后，还是这个， ctrl + shift + p，运行:

Enable Custom CSS and JS
启用自定义样式, 这一步，很关键！后面修改之后 css 之后，也是再来一遍。
成功之后，会出现一个警告。 请点击：下次不要再弹出来了。