Atom代码提示框需通过styles.less修改.max-height、line-height和padding协同调整，仅调font-size会导致溢出错位；应使用@text-color等内置变量适配主题。
Atom 的代码提示框（autocomplete-plus 弹出面板）默认尺寸偏小、行高紧凑，尤其在高分屏或启用较大字体时容易遮挡内容、难以阅读。它不响应系统缩放，也不能通过主题 CSS 直接用 font-size 粗暴放大——那样只会让文字溢出、布局错乱。真正可控的方式是修改其容器的 max-height、line-height 和内边距，并确保弹窗能随内容动态撑开。
怎么改 autocomplete-plus 提示框高度和字体可读性
提示框由 autocomplete-plus 包渲染，样式入口在 Atom 的全局 styles.less 文件里。直接覆盖它的 .autocomplete-suggestion-list 和子元素即可，无需动插件源码。
- 打开
styles.less：按Ctrl+Shift+P（Win/Linux）或Cmd+Shift+P（Mac），输入Application: Open Your Stylesheet回车 - 在文件末尾添加以下规则（可按需调整数值）：
.autocomplete-suggestion-list { max-height: 400px; font-size: 14px; } .autocomplete-suggestion-list .suggestion-description { font-size: 12px; line-height: 1.5; } .autocomplete-suggestion-list .suggestion-icon, .autocomplete-suggestion-list .suggestion-text { padding: 6px 12px; } - 保存后立即生效，无需重启 Atom；若没变化，检查是否被其他 UI 主题的
!important覆盖（极少见，但one-dark-ui某些版本有）
为什么不能只调 font-size？
单纯增大 font-size 会导致两个问题：
-
.suggestion-text容器高度固定，文字会垂直溢出，看不到下半部分 - 图标区（
.suggestion-icon）和文字区未同步缩放，造成图文错位或图标被裁剪 - 行高（
line-height）未重设时，多行描述文字会挤在一起，可读性反而下降
所以必须同时控制 padding、line-height 和容器 max-height，三者协同才稳定。
立即学习“前端免费学习笔记（深入）”；
如何让提示框适配深色/浅色主题自动切换
Atom 的语法和 UI 主题是分离的，styles.less 是全局生效的。如果你用了 one-dark-ui + one-dark-syntax 组合，上面写的 CSS 就已生效；但若你切到 one-light-ui，背景色变白，而提示框默认背景仍是深灰——这时文字就看不清了。
- 安全做法是显式定义背景和文字色：
.autocomplete-suggestion-list { background-color: @app-background-color; color: @text-color; } .autocomplete-suggestion-list .suggestion-text { color: @text-color; } -
@app-background-color和@text-color是 Atom 内置 LESS 变量，会随当前 UI 主题自动取值（比如深色主题下为#282c34/#abb2bf，浅色下为#ffffff/#333333） - 变量只在
styles.less中可用，不能用于普通 CSS 文件
真正麻烦的不是改大小，而是当项目里装了 atom-ide-ui 或 ide-typescript 后，它们会注入自己的提示组件（如 .ide-hint），这些不走 autocomplete-plus 流程，得单独加 CSS 规则覆盖——否则你会看到两种尺寸混用的提示框。
