Javascript 是否有一种方法可以使用子级对父vue组件中的元素进行上下文样式设置？

最好用一个例子来说明这一点： 这是一个可重用的

侧边栏.vue

组件的模板（使用vuetify，尽管我认为这与这个问题无关-我还必须删除模板标记本身，因为它们会影响堆栈溢出时的渲染）：

{{heading}}

下面是使用此侧栏的父vue组件的示例部分：

<sidebar>
    <v-card-title class="stages-subheading">Stage name</v-card-title>
</sidebar>

艺名

我想要实现的是，如果我将一个元素放入侧边栏的实例中，就像上面第二个框中的

v-card-title

被放置在侧边栏的实例中一样，子元素会将样式应用于该元素，因为它位于其标记中。因此，在上述情况下，每当我想在父组件中使用

class=“stages subheading”

v-card-title时，我都必须使用

这可能是一个简单的例子，但我需要理解如何做到这一点的概念，这样我才能更进一步

我试着用谷歌搜索我能想到的所有东西，但都没有用，所以我非常感谢任何帮助：）
CSS规则是身份、兄弟姐妹关系或后代关系的形式。据我所知，CSS不支持祖先关系规则。我想这篇文章回答了你的问题：只是好奇，你能在侧边栏和v-card-title中发布你的CSS部分吗？谢谢大家的回复，我相信要解决这个具体问题，Sebasanz的文章就是解决方案——我需要使用CSS选择器。似乎不可能在child.vue中定义，而是在全局css中定义？我将按Kick Buttowski的要求在下面发布CSS…v-card标题样式：。阶段副标题{font family:$font family roboto bold！重要；字体大小：17px！重要；颜色：黑色；填充底部：0px；}侧边栏组件刚刚获得访问我们全球CSS样式的权限，stages heading样式类在这里不相关。CSS规则的形式为标识、兄弟关系或后代关系。据我所知，CSS不支持祖先关系规则。我想这篇文章回答了你的问题：只是好奇，你能在侧边栏和v-card-title中发布你的CSS部分吗？谢谢大家的回复，我相信要解决这个具体问题，Sebasanz的文章就是解决方案——我需要使用CSS选择器。似乎不可能在child.vue中定义，而是在全局css中定义？我将按Kick Buttowski的要求在下面发布CSS…v-card标题样式：。阶段副标题{font family:$font family roboto bold！重要；字体大小：17px！重要；颜色：黑色；填充底部：0px；}侧边栏组件刚刚获得访问我们全球CSS样式的权限，阶段标题样式类在这里不相关。
<sidebar>
    <v-card-title class="stages-subheading">Stage name</v-card-title>
</sidebar>