vue css deep

作者：思念的回忆发布日期:2025-07-21 浏览:13

/* 使用 ::v-deep 深度选择器 */
<style scoped>
.parent-class ::v-deep .child-class {
  color: red;
}
</style>

<!-- 解释说明：
::v-deep 是 Vue 中用于深度选择子组件样式的选择器。在上面的例子中，.parent-class 是父组件的类名，
而 .child-class 是子组件中的类名。通过使用 ::v-deep，我们可以为子组件中的 .child-class 元素设置样式，
即使这些样式是在父组件中定义的。

注意：在 Vue 3 中，::v-deep 已经被 :deep() 替代，语法如下： -->

<style scoped>
.parent-class :deep(.child-class) {
  color: red;
}
</style>

上一篇：vue tailwindcss

下一篇：vue includes用法