phpmyadmin 5.1 sql编辑器不支持原生高对比度主题,需通过stylus插件注入css强制覆盖codemirror语法高亮颜色,并禁用自动换行以保障可读性。

phpMyAdmin 5.1 的 SQL 编辑器不支持原生高对比度主题
phpMyAdmin 5.1 自带的 SQL 编辑器(基于 CodeMirror 5)默认只提供有限的配色方案,且无法通过界面开关切换高对比度模式。它不读取系统级暗色偏好,也不暴露完整的 CodeMirror 主题配置入口。强行修改 config.inc.php 中的 $cfg['CodemirrorEnable'] 或 $cfg['SQLQuery']['EditLine'] 不会影响语法高亮对比度,只会控制是否启用编辑器或行号显示。
用自定义 CSS 强制覆盖 CodeMirror 高亮颜色(最直接有效)
phpMyAdmin 5.1 页面加载后会注入 CodeMirror 的样式表,但这些规则优先级不高,可用 !important 覆盖关键 token 类。重点改以下几类:
-
.cm-keyword(如SELECT、FROM)→ 改为#005f87加粗 -
.cm-string(单/双引号内内容)→ 改为#a31515,避免灰白难辨 -
.cm-number和.cm-atom(数字、NULL、TRUE)→ 改为#2b7409 -
.cm-comment→ 用#808080灰度而非浅灰,确保可读 - 必须加
body .CodeMirror前缀提高选择器权重,否则被内置样式覆盖
将如下 CSS 粘贴进浏览器 Stylus 插件(推荐),作用域限定为 phpMyAdmin 页面:
body .CodeMirror .cm-keyword { color: #005f87 !important; font-weight: bold !important; }
body .CodeMirror .cm-string { color: #a31515 !important; }
body .CodeMirror .cm-number, body .CodeMirror .cm-atom { color: #2b7409 !important; }
body .CodeMirror .cm-comment { color: #808080 !important; }
禁用 CodeMirror 换行与自动缩进以提升可读性
高对比度对齐的前提是代码不被折行干扰。phpMyAdmin 5.1 默认开启 lineWrapping: true,导致长 SQL 被截断换行,关键词分散在不同行,破坏视觉连续性。
- 在
config.inc.php中定位到$cfg['SQLQuery']['EditLine'] = true;,改为false - 添加显式 CodeMirror 配置项:
$cfg['CodemirrorOptions'] = ['lineWrapping' => false, 'autoCloseBrackets' => false, 'matchBrackets' => true]; - 注意:若
$cfg['CodemirrorOptions']已存在,直接合并键值,不要重复定义数组 - 修改后需清空浏览器缓存并重载 phpMyAdmin 页面,否则旧 JS 缓存可能忽略新配置
避免用 Tampermonkey 注入样式替代 CSS 方案
有人试图用 JS 动态改 document.styleSheets 或插入 <style></style> 标签,这在 phpMyAdmin 5.1 上容易失败:
- CodeMirror 实例在 DOM 就绪后延迟初始化(约 200–400ms),
DOMContentLoaded时样式表尚未生成 - phpMyAdmin 5.1 启用 CSP 策略,禁止
unsafe-inline样式,Tampermonkey 注入的<style></style>会被浏览器拦截 - Stylus 绕过 CSP,纯 CSS 注入,无执行时机问题,稳定性高一个数量级
真正影响高对比度效果的不是“能不能加颜色”,而是能否稳定、及时、不被覆盖地把颜色落到每个 token 上——Stylus 是目前唯一可靠路径。
php免费学习视频:立即使用
踏上前端学习之旅,开启通往精通之路!从前端基础到项目实战,循序渐进,一步一个脚印,迈向巅峰!











