老浏览器真正安全的颜色关键字只有css 2.1定义的16个：black、white、red、green、blue、yellow、cyan、magenta、gray（grey）、lightgray、darkgray、silver、maroon、purple、olive、navy，它们在ie6+及所有现代浏览器中均能可靠解析；扩展色名如rebeccapurple需提供十六进制或rgb降级。
哪些颜色关键字是真正安全的
只依赖 CSS 2.1 定义的 16 个基础色名，浏览器兼容性才真正兜底：
black、white、red、green、blue、yellow、cyan、magenta、gray（或 grey）、lightgray、darkgray、silver、maroon、purple、olive、navy
- 它们在 IE6+、所有现代浏览器、甚至多数旧版 WebView 中都能解析成功
-
lightgray和gray在部分浏览器里实际指向同一色值（#d3d3d3），别指望它们有明确明暗区分 - 拼写如
light-gray或light gray是非法的，浏览器直接忽略整条声明
transparent 不是“颜色”，但必须单独记住
transparent 是唯一一个被专门定义为“无颜色”的关键字，不是 rgba(0,0,0,0) 的简写：
- 它在 IE9+ 全支持；
rgba(0,0,0,0)在 IE8 及更早版本会整个声明失效 - 用于
background-color时，transparent更轻量、语义更准，且不影响可访问性树中对背景的判断 - 别写
color: transparent;来隐藏文字——它会让文字不可读（屏幕阅读器仍会朗读），该用visibility: hidden或aria-hidden="true"
扩展色名（如 rebeccapurple、hotpink）要加 fallback
CSS3 新增的 120+ 个色名（比如 rebeccapurple、lightseagreen、darkslategray）在 Chrome/Firefox/Safari 最新版都行，但在以下场景容易出问题：
- 旧版 Safari（≤12）、某些 Android WebView（尤其 2024 年前的定制内核）可能完全不认识，直接丢弃该声明，回退到继承值（常是黑色）
- 没有自动降级机制——浏览器不会“找不到就用
gray代替”，它只会跳过 - 正确写法是显式提供备用值，且顺序不能反：
color: #6a5acd;<br>color: slateblue;
（后者覆盖前者；反过来写等于白写）
关键字不支持透明度，强行加 alpha 会直接失效
所有颜色关键字本身不含 alpha 通道。下面这些写法全是错的：
-
color: red(0.5);→ 语法错误，整条声明被忽略 -
color: rgba(red, 0.5);→red不是数值，rgba()不接受关键字参数 - 想实现“半透的 blue”，必须先查它的 RGB 值：
blue=rgb(0, 0, 255)，再写成rgba(0, 0, 255, 0.3)或hsla(240, 100%, 50%, 0.3)
orange 在标准里固定是 #ffa500，但某些嵌入式 WebKit 内核（尤其是车载或工控设备）可能用自定义色表，导致同一名字显示偏黄或偏红——这种差异没法 debug，只能提前规避。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
