Sublime Text 3 必须同时安装 Emmet 和 aaronpowell/austinhappel 版 CSS3 插件，手动切换语法为“CSS3”，并配置 auto_complete_triggers 触发冒号，启用 enable_experimental 才能支持现代 CSS 属性值自动补全。

Sublime Text 3 原生不支持 CSS 属性值自动补全（比如输 display: 后弹出 flex、grid），装错插件或漏配关键项，补全就永远不出现——不是“没效果”，而是根本没启动。

必须装 Emmet + CSS3（aaronpowell 版）两个插件

只装一个等于白装：Emmet 负责缩写展开（如 d:f → display: flex），CSS3（作者必须是 aaronpowell 或 austinhappel）才真正替换原生语法定义，让 gap、aspect-ratio、backdrop-filter 不标红、能进补全池。

• 别搜“CSS3 插件”这种词——搜到的多数是停更包（如 arokor 版），对 container 查询、scroll-behavior 完全没支持
• Package Control 中搜 Emmet 和 CSS3，认准作者名和蓝色 CSS3 logo；图标带齿轮的 Autoprefixer 或 CSS Extensions 不是你要的
• 手动解压 zip 或 git clone 到 Packages/ 目录？90% 失败：路径大小写错（CSS3 ≠ css3）、CSS3.sublime-syntax 文件没放对位置、ST4 版本不匹配都会导致右下角始终显示 CSS

右下角必须显示 “CSS3”，否则补全全失效

插件装完不会自动切换已有文件的语法模式。哪怕你新建一个 style.css，右下角默认还是 CSS，grid-area 依然灰底、fr 单位不识别。

• 新建文件后，点右下角 → 选 CSS3
• 已打开的 .css 文件仍显示 CSS：执行 View → Syntax → Open all with current extension as… → CSS3
• 用 .module.css 或 .pcss 等非标后缀？在该文件的 Preferences → Settings – Syntax Specific 里加："syntax": "Packages/CSS3/CSS3.sublime-syntax"（注意路径是 CSS3，不是 CSS）
• 切完语法后建议按 Ctrl+R 重载文件，否则高亮和补全可能延迟生效

补全不弹？检查 auto_complete_triggers 是否配了冒号

CSS3 插件本身不改 Sublime 的补全触发逻辑。它只提供词典，不控制“什么时候弹”。输 dis 不会出 display，但输完 display: 后必须立刻弹值列表——前提是触发配置正确。

PigX UI 前端开发

PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。

下载

• 在 Preferences → Settings（用户设置）里确认有以下配置：

{
  "auto_complete": true,
  "auto_complete_selector": "source.css -comment",
  "auto_complete_triggers": [
    {"selector": "source.css", "characters": ":"}
  ]
}

• 漏掉 auto_complete_triggers，或把 source.css 错写成 text.html.basic，都会导致 HTML 标签名混进 CSS 补全里，结果全是错的
• 如果用了其他语法高亮插件（如 CSS Extended Completions），它们可能覆盖 source.css scope，导致触发器失效

backdrop-filter 还是没提示？开 enable_experimental

即使语法和补全都配好了，backdrop-filter、scroll-behavior、contain 这类实验性属性默认不进补全列表。

立即学习“前端免费学习笔记（深入）”；

• 打开 Preferences → Package Settings → CSS3 → Settings
• 在用户设置里加一行："enable_experimental": true
• 这个开关不光影响补全，也决定 gap、inset 等较新属性能否高亮——关着就是灰底+标黄

补全看起来简单，但实际依赖三重对齐：插件版本对得上 ST4、语法模式强制切到 CSS3、触发器精准绑定冒号。少一环，grid-template-areas 就永远只是个拼写错误。