CSS Typed OM 中数值类型匹配规则的演进与解析

CSS Typed OM 规范中关于数值类型匹配的规则经历了一次重要的演进，这对开发者理解 CSS 计算值的处理逻辑有着重要意义。本文将深入解析这一变化及其对 CSS 解析的影响。

原始匹配规则

在早期版本的 CSS Typed OM 规范中，类型匹配 <number> 的条件非常严格：类型必须具有 null 百分比提示(percent hint)。这意味着任何涉及百分比的计算值，如果最终要匹配 <number> 类型，都必须确保计算过程中百分比的影响被完全消除。

规则变更带来的问题

规范更新后，匹配规则放宽了限制：只有在使用值的上下文不允许 <percentage> 值时，类型才需要具有 null 百分比提示才能匹配 <number>。这一变化导致了一些意外的解析结果。

例如，opacity: calc((1% + 1px) / 1px) 这样的表达式在理论上变得有效，因为：

1. 上下文允许 <number> 和 <percentage>（百分比会解析为 <number>）
2. 1% 的类型是 [percent → 1]
3. 1% + 1px 的类型变为 [length → 1]，带有 length 百分比提示
4. (1% + 1px) / 1px 的类型是 [length → 0]，仍然带有 length 百分比提示
5. 最终类型 [length → 0] 带有 length 百分比提示，匹配 <number>

这种结果显然不符合预期，因为 1% 在这种上下文中没有明确的解析基准。

修正后的匹配规则

经过讨论，规范进行了进一步修正。现在，匹配 <number> 的规则需要考虑百分比提示与上下文的关系：

1. 类型匹配 <length> 的条件是其唯一非零条目是 «[ "length" → 1 ]»（其他基本类型如 <angle>、<time> 等同理）
2. 类型匹配 <number> 的条件是其没有任何非零条目
3. 关键新增：如果类型有百分比提示，其值必须与上下文中 <percentage> 解析到的类型相匹配

这一修正确保了像 opacity 这样的属性（不解析百分比到任何其他类型）会要求计算值具有 null 百分比提示，从而使 opacity: calc((1% + 1px) / 1px) 保持无效状态。

实际影响与开发者注意事项

这一变化对 CSS 解析引擎的实现者和使用 CSS Typed OM API 的开发者都有重要影响：

1. 类型系统更精确：现在能更准确地反映百分比在不同上下文中的解析行为
2. 边缘情况处理：需要考虑手工创建的 CSSNumericValue 可能产生的非标准类型组合
3. 上下文感知：百分比提示必须与使用上下文中的百分比解析目标类型一致

开发者在使用 CSS 计算值时，应当注意百分比在不同属性中的解析方式差异，确保表达式在目标上下文中具有正确的类型特征。

这一演进体现了 CSS 规范在保持灵活性的同时，对类型系统精确性的持续改进，为更安全、更可预测的样式计算奠定了基础。