VSCode编辑器行高由editor.lineHeight配置项控制,而非CSS的lineHeight或letterSpacing;其值单位为px,默认0表示自动计算(约字体大小1.2倍),可设为24或18等固定值以调整松紧度。

lineHeight 和 letterSpacing 都不能直接调编辑器行高
VSCode 编辑器的行高(即代码行与行之间的垂直间距)不是靠 CSS 的 lineHeight 或 letterSpacing 控制的,这两个属性在 VSCode 的主题或用户设置里完全无效。你改了也没反应,是因为编辑器渲染层压根不读这些 CSS 属性。
真正起作用的是内置配置项 editor.lineHeight,它控制的是「每行文本基线到下一行基线的距离」,单位是像素(px),默认值为 0(表示自动计算,通常约等于字体大小的 1.2 倍)。
-
editor.lineHeight: 0→ 自动适配,但具体数值取决于字体、DPI、缩放比例,不稳定 -
editor.lineHeight: 24→ 强制设为 24px,适合 14–16px 字体,阅读更宽松 -
editor.lineHeight: 18→ 紧凑模式,适合小屏或大字号场景
修改 editor.lineHeight 的三种方式及优先级
VSCode 支持多级配置覆盖,顺序从低到高:默认设置
- 用户全局设置:打开
settings.json(Ctrl+, → 右上角 {} 图标),加一行"editor.lineHeight": 22 - 当前项目专属设置:在项目根目录建
.vscode/settings.json,写入同上配置,只对这个文件夹生效 - 临时调试:命令面板(Ctrl+Shift+P)搜
Preferences: Open Settings (JSON),确认你编辑的是目标 settings 文件
注意:editor.lineHeight 必须是整数,小数(如 22.5)会被截断为 22,且重启编辑器不必要,保存后实时生效。
为什么改了 lineHeight 还觉得“行距没变”?
常见错觉来源有两个:一是字体本身带额外上下留白(比如 Fira Code 或 JetBrains Mono 的 ascender/descender 较高),二是 VSCode 的行高计算不含「行号栏」和「折叠箭头」的占位空间,视觉上容易误判。
- 验证是否生效:打开一个纯空行文件,选中几行按 Ctrl+Shift+P →
Developer: Toggle Developer Tools,在 Elements 面板里找.view-line元素,看 computed 样式里的height是否匹配你设的editor.lineHeight - 如果仍不满意,可搭配
editor.fontSize调整,比如把字体从14改成13再把lineHeight设为20,比单调 lineHeight 更可控 - 某些插件(如
Bracket Pair Colorizer或自定义语法高亮)可能注入额外 inline 元素,干扰行高渲染,关掉插件测试能快速定位
Mac / Windows / Linux 下的兼容性差异
editor.lineHeight 在所有平台行为一致,但实际显示效果受系统字体渲染影响明显:
- macOS 上启用了 subpixel antialiasing,相同
lineHeight值下视觉行距略显“密” - Windows 默认 ClearType 渲染,
lineHeight: 22在 100% 缩放下表现最稳;若系统缩放为 125%,建议同步调高到26左右 - Linux(尤其是 Wayland + GNOME)可能因字体 hinting 设置不同,出现行高轻微浮动,此时固定
editor.lineHeight比依赖0更可靠
别指望用 zoomLevel 替代 lineHeight——那只是整体缩放,会连带放大侧边栏和图标,不是真正的行间距控制。


















