Vue3 CSS扩展

::v-slotted

Vue3中，父级传入的插槽内容不再受子级样式的影响，子元素需要使用新的::v-slotted()伪元素来专门针对插槽内容：

::v-slotted(.foo) {}

/* 简写 */
:slotted(.foo) {}

伪元素::v-global()可用于在<style scoped>块内定义全局样式；

::v-global(.foo) {}

/* 简写 */
:global(.foo) {}

在<style> 中访问响应式的数据

<style scope>

h1 {
    color: v-bind(color);
    size: v-bind('state.size');
}

</style>