CSSWG-Drafts：CSS Cascade模块中关于@scope规则直接声明的新特性解析

CSS工作组近期针对CSS Cascade模块中的@scope规则进行了一项重要讨论，决定允许在顶层@scope规则中直接使用声明语句。这一变化将显著提升样式表的编写效率和可读性，是CSS嵌套语法演进过程中的重要里程碑。

传统上，@scope规则体内只能包含规则语句。若需要对作用域根元素应用样式，开发者必须显式使用:scope规则。例如：

@scope (div) {
  :scope {
    color: green;
  }
}

随着CSS嵌套语法中"宽松嵌套"特性的引入，解析器现在能够智能区分声明语句和嵌套规则。这一技术突破为@scope规则支持直接声明铺平了道路。新规范实施后，上述代码可以简化为：

@scope (div) {
  color: green;
}

在CSSOM处理方面，直接声明语句将被自动包装为:scope规则，保持与现有CSS对象模型的一致性。这一设计既保证了向后兼容性，又提供了更简洁的编写方式。

关于选择器特异性的处理，工作组明确了以下规则：

• 直接声明的特异性为0,0,0
• 普通选择器(如p)的特异性为0,0,1
• 使用:scope前缀的选择器(如:scope p)特异性为0,1,1
• 使用&符号的选择器(如& p)特异性为1,0,1

当@scope规则嵌套使用时，其起始选择器(<scope-start>)会作为父规则影响&符号的解析。例如在div { @scope (#foo) { & p {} } }中，最终选择器相当于div #foo p，特异性为1,1,1。

这一变更使得CSS作用域样式的编写更加直观和高效，同时保持了与现有CSS特性的良好一致性。开发者现在可以更自由地选择最适合项目需求的语法风格，无论是传统的显式:scope规则还是新的直接声明语法。