Sublime Text 不支持 CSS 的 text-shadow 或 box-shadow,所谓“代码块阴影”实为通过 scope 背景色明度差营造的视觉对比;需手动编辑 .sublime-color-scheme 文件,在 rules 中为对应作用域(如 text.html.basic meta.embedded.block.php)设置 background 色值。
Sublime Text 本身不支持给代码块加 CSS 风格的
或
,所谓“代码块背景阴影”实际是误读——它没有该能力,强行套用 Web 概念只会卡在配置里反复失败。
为什么直接搜“text-shadow”或“box-shadow”会白忙活
Sublime 的渲染层不解析 CSS,所有视觉样式都靠作用域(scope)匹配 + 颜色方案(
)驱动。你在 HTML/CSS 文件里写的
,只对浏览器生效,对 Sublime 编辑器零影响。
所有“阴影”类需求,本质是调整背景色、选中色、区域高亮色之间的明度差和边界感
试图在
里加
或类似字段,不会生效——Sublime 没这个配置项
第三方插件(如 BracketHighlighter)能画括号边框,但那不是“阴影”,而是独立绘制的矩形区域,无法控制模糊半径或偏移
想让 PHP/JS 嵌入块“看起来有阴影感”,得改 scope 背景色
比如 HTML 中的
块视觉上“浮起来”,不是靠阴影,而是让它背景色比周围 HTML 稍深或稍浅,形成自然对比。
必须编辑当前启用的
文件,在
数组里添加作用域规则
对多行 PHP 块:加
对单行 PHP(
):再加一条
必须前置限定,否则会污染纯
文件的语法高亮
背景色差建议控制在
→
这种微调,太强反而割裂阅读流
选中区域“像带阴影的浮层”?其实是 background + opacity 协同
Sublime 支持 RGBA 格式,用透明度模拟“半透阴影感”最接近真实效果,但必须写对格式,否则整条规则静默失效。
仿Sublime和notepad++编辑器效果
仿Sublime和notepad++编辑器效果
下载
在
的
末尾加:
注意:必须是 8 位 hex(
),
是合法的,
或
会被忽略
别用
—— Sublime color scheme 不识别函数式写法
如果用了
(XML 格式),对应写法是
,同样只认 8 位
Find 高亮、括号匹配、Git 差异标记也想“带阴影感”
这些都归
管,不是全局背景,也不是 selection,得单独设。
在同一个
文件的
里追加:
是通用高亮容器,Find 结果、括号匹配边框、SideBarGit 插件的变更标记都走这条路
用低饱和灰+中等透明度(如
)比纯色更柔和,避免抢焦点
如果发现高亮太淡看不见,优先调高 alpha 值(后两位),而不是换更亮的颜色——明度突变会破坏护眼一致性
真正难的不是加哪条规则,而是所有 scope 的 background、foreground、opacity 必须统一在 HSL 色系下协调;调一个
而不碰
和
,结果就是选中块像浮雕,注释却刺眼跳动——视觉疲劳从来不是某一处的问题。
text-shadowbox-shadow.sublime-color-schemetext-shadow: 2px 2px 4px #000Preferences → Settings"shadow": true.sublime-color-scheme"rules"{"scope":"text.html.basic meta.embedded.block.php","background":"#252525"}={"scope":"text.html.basic meta.embedded.line.php","background":"#252525"}text.html.basic.php#1e1e1e#252525.sublime-color-scheme"rules"{"scope":"selection","background":"#3a405aCC"}#RRGGBBAA#3a405a80#3a405a8#3a405a8080rgba(58, 64, 90, 0.8).tmTheme#3a405aCC "scope": "region".sublime-color-scheme"rules"{"scope":"region","background":"#4a556866"}region#4a556866selectionregioncomment