Atom 自定义样式必须写在用户级 styles.less 文件中，路径为 ~/.atom/styles.less（macOS/Linux）或 %USERPROFILE%\.atom\styles.less（Windows），通过 Atom 菜单「Atom → Stylesheet…」可自动创建并打开；保存后实时生效，无需重启。
styles.less 文件在哪改才生效
Atom 的自定义样式必须写在用户级 styles.less 里，不是插件目录或全局安装路径下的同名文件。改错地方等于白干。
正确路径是：~/.atom/styles.less（macOS / Linux）或 %USERPROFILE%\.atom\styles.less（Windows）。首次使用可直接在 Atom 菜单栏点 Atom → Stylesheet…，它会自动创建并打开这个文件。
- 每次保存
styles.less，Atom 会实时重载样式，不用重启 - 如果改了没反应，先确认文件编码是 UTF-8（无 BOM），且没被其他编辑器锁住
- 不要往
~/.atom/packages/xxx/styles.less里塞自定义规则——那是插件自己的样式，你改了下次更新就丢
怎么精准选中某个 UI 元素来改样式
Atom 是基于网页技术的桌面应用，所有界面都是 DOM 元素，但结构嵌套深、类名动态生成（比如带哈希后缀），靠猜类名基本无效。
必须用开发者工具：按 Cmd+Opt+I（macOS）或 Ctrl+Shift+I（Windows/Linux）唤出 DevTools，然后用左上角的「选择元素」图标点选目标区域，看右侧 Styles 面板里生效的 CSS 规则和对应的选择器。
- 优先用
.tool-panel、.tab-bar、.editor这类稳定语义类，少用.line-number这种可能被多个组件复用的类 - 避免用
div:nth-child(3)这类位置依赖选择器——UI 更新后极易失效 - 如果想改某语言的代码高亮色，得结合语法作用域，比如
.syntax--source.syntax--js .syntax--string
常见改样式失败的三个原因
写对了路径、选对了元素，还是没效果？大概率卡在这三处：
-
!important不是万能解药，但 Atom 内置样式权重极高，有时非加不可；不过加多了反而难调试，建议先试提高选择器特异性（比如加父容器类） - 某些 UI 组件（如命令面板
.command-palette）是懒加载的，样式表加载时它还没挂到 DOM 上，得用:host或更宽泛的上下文选择器兜底 - 用了变量但没定义——
styles.less支持 LESS 语法，但 Atom 不提供预设变量（比如@text-color），所有颜色/尺寸都得自己写死或用rgba()手动算透明度
改字体大小和行高的安全范围
调大编辑器字体看着舒服，但容易引发布局错位，尤其是行号区、折叠箭头、光标对齐这些地方。
推荐只改 .editor 和 .editor .line 的 font-size 和 line-height，别碰 .gutter 或 .scroll-view 的高度计算逻辑。
- 行高建议设为无单位数值（如
line-height: 1.4;），避免和字体大小耦合出意外缩放 - 如果启用了
soft wrap，记得同步调大.editor.is-focused .wrap-guide的左右偏移，否则换行线会偏左 - 改完记得在不同文件类型（.md、.py、.jsx）下都扫一眼，有些语法主题会覆盖你的基础设置
