atom不支持按语义关键词设斜体，只能基于语法scope统一设置font-style: italic；需用devtools确认真实scope，新版需去掉::shadow伪元素；snippets.cson无法控制样式，须在styles.less中配置对应scope规则。
Atom 里不能直接给某个“关键词”设斜体，它不支持按语义（比如 property-key）单独样式化；能做的，是基于语法 scope 给某类 token 统一加 font-style: italic —— 比如所有 HTML 属性名、CSS 属性名、或 JS 对象键名。
为什么 .entity.other.attribute-name 能让 HTML 属性变斜体
Atom 的样式系统只认 CSS 类名（即 grammar 输出的 scope class），不认语义。HTML 语法包（language-html）把 class、id、alt 这些属性名解析为 .entity.other.attribute-name，所以加这条规则就生效：
atom-text-editor::shadow .entity.other.attribute-name {
font-style: italic;
}
但注意：::shadow 在新版 Atom（1.60+）已弃用，必须改用 ::before 或直接去掉——实际生效的是：
atom-text-editor .entity.other.attribute-name {
font-style: italic;
}
- scope 名必须和当前 grammar 输出完全一致，差一个点或大小写都不行
- 打开 DevTools（
Ctrl+Shift+I），选中一个属性名，右键 →Inspect Element，看 class 列表确认真实 scope - 如果用了
language-babel或atom-ide-ui，JS 中对象键可能属于.meta.object-literal.key，不是.entity.other.attribute-name
snippets.cson 里没法控制字体样式
代码片段（snippet）只管插入什么文本、光标停在哪，不参与渲染。你无法在 snippets.cson 里写 font-style: italic 或类似声明——那属于样式层，得去 styles.less（或 styles.css）里配。
-
snippets.cson路径固定：~/.atom/snippets.cson，内容是 CSON 格式，仅定义 prefix/body/scope - 想让某个 snippet 插入的内容“看起来斜体”，只能靠它触发后，被 grammar 正确识别并匹配到已有斜体 scope 规则
- 例如：插入
data-id，如果 grammar 把它标为.entity.other.attribute-name，且你已配了对应样式，它才斜体
JS 对象键、Vue/React 的 prop 名怎么变斜体
这些没统一 scope，得手动查、逐个配。比如在 JSX 中，className、onClick 属于 .support.type.property-name.js；Vue 模板里的 v-if 可能是 .keyword.control.directive.vue。
- 用
Ctrl+Shift+P→Editor: Log Cursor Scope，把光标放在目标词上执行，看输出最末尾的 scope - 在
styles.less里追加对应规则，例如：.support.type.property-name.js { font-style: italic; } - 别盲目套用网上老教程的 scope，Atom 语法包更新后 scope 常会变（比如从
.attribute-name变成.entity.other.attribute-name） - 多个 scope 要斜体？用逗号分隔，不要写成数组：
.support.type.property-name.js, .keyword.control.directive.vue { font-style: italic; }
真正麻烦的不是加斜体，而是 scope 不稳定——换一个语法插件、升级一次 language package，原来好使的样式就失效。每次改动前先 Log Cursor Scope，比猜省半小时。
