css /deep/

Css /deep/ 是一种用于覆盖子组件内样式的伪类选择器，它可以穿透组件的边界，作用于子组件内的样式。这个伪类选择器通常在父组件的样式中使用，用于选择子组件的元素并覆盖其样式。

例如，在父组件的样式中使用 /deep/ 选择器可以选择子组件中的元素并修改其样式。比如，父组件中的样式可以这样写：

<style scoped>
.wrap /deep/ .child {
  color: red;
}
</style>

这样就能够选择到子组件中的 .child 类，并将其文字颜色设置为红色。 通过使用 /deep/ 选择器，父组件可以穿透子组件的样式边界，实现对子组件内部元素样式的修改。

需要注意的是，/deep/ 伪类选择器在较新版本的 CSS 规范中已经被弃用，推荐使用其他方式来处理组件样式的嵌套问题。例如，使用 CSS Modules 或 CSS-in-JS 等技术，可以更好地管理组件样式的封装性和可维护性。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [css: deep深度作用选择器](https://blog.csdn.net/weixin_39357177/article/details/114371187)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]