对于CSS属性，“规范顺序”意味着什么？

Question

MDN关于CSS属性(示例)的页面和CSSWG的一些规范(示例)引用了该属性的“规范顺序”。

例如，MDN表示display的规范顺序是：

由形式语法定义的唯一的无歧义顺序。

CSSWG的挠性盒规范表示，flex的规范顺序是：

每语法

在MDN上，似乎每个CSS属性都被列出为具有规范顺序；在CSSWG用作新属性规范模板的有趣的CSS Foo模块级N规范中也提到了规范顺序。

这意味着什么，指定的意思在哪里(如果在任何地方)？我还没有找到“在线”这个词的定义，也没有想到任何明显的猜测。

Answer 1

属性的语法是指CSS声明中所述属性值的语法。大多数属性使用单个值，但有些属性以设置的顺序接受多个值，例如box-shadow和background-repeat，以及速记属性。这种语法通常直接出现在"Value:“行中，但可以在散文中详细说明，例如，如果属性采用逗号分隔的这种复杂值的列表。

例如，速记的语法定义为零或多个<bg-layer>，后面跟着一个<final-bg-layer>，其中

<bg-layer> = <bg-image> || <position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <box> || <box>
<final-bg-layer> = <bg-image> || <position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <box> || <box> || <'background-color'>

这两个<box>值描述如下：

如果存在一个<box>值，那么它将“背景-源”和“背景-剪辑”设置为该值。如果存在两个值，则第一组设置“背景-原点”，第二组设置“背景剪辑”。

每个组件之间的||分隔符意味着其中一个或多个组件可以以任何顺序发生。对于background，请注意background-position和background-size之间没有||；这意味着这两个属性需要同时出现。 (对于指定background-size，必须包括background-position )。

例如，以下两个声明是有效和等效的：

background: url(see-through.png) center / 100% no-repeat fixed padding-box red;
background: red url(see-through.png) fixed padding-box no-repeat center / 100%;

没有规范似乎定义了术语“规范顺序”，但是CSSOM在序列化的上下文中对它进行了多次引用。例如，在第5.4.3节中，它说：

指定的声明顺序与指定的顺序相同，但速记属性按规范顺序扩展为它们的长时间属性。

这些长地的值是为了getPropertyValue()、setProperty()、setPropertyValue()和setPropertyPriority()的目的而序列化的，所有这些值都引用了“规范顺序”。

并不是每个属性都有规范顺序，因为如上所述，大多数属性都只接受一个值；“规范顺序：”行存在于css中的惟一propdef表中，仅仅因为它是一个模板。此外，CSSOM似乎暗示只有速记属性才有规范顺序。

根据我对相关规范的理解，当将速记属性的规范顺序定义为该值的语法时，它仅仅意味着它的长数字应该按照语法定义的顺序序列化。因此，上述两个简短声明应该按照与以下长时间声明集完全相同的顺序序列化：

background-image: url(see-through.png);
background-position: center;
background-size: 100%;
background-repeat: no-repeat;
background-attachment: fixed;
background-origin: padding-box;
background-clip: padding-box;
background-color: red;

(有趣的是，背景模块中给出的从短到长的映射示例似乎没有遵循这个顺序。)