CSS @scope

@scope 可以限制选择器的范围，可以通过设置范围根来执行此操作，该范围根确定要定位的子树的上便捷，通过作用域根集，所包含的样式规则（称为作用域样式规则）只能从DOM的有限子树中进行选择。

例如，要仅定位组件 <img /> 中的元素 .card，可以设置 .card 为 at 规则的作用域根@scope

@scope (.card) {
	img {
		border-color: red;
	}
}

还可以使选择器更加具体

@scope (.card) to (.card_content) {
	img {
		border-color: red;
	}
}

默认情况下，所有的作用域样式规则都相对于作用域根，还可以将范围根元素本身作为目标。使用 :scope 选择器

@scope (.card) {
	:scope {
		/* Selects the matched .card itself */	
	}
	img {
		/* Selects img elements that are a child of .card */
	}
}