什么是深度选择器？
scoped 属性是HTML5中的新属性，<style scoped>标签在加上了该属性时，样式实现组件私有化，当前父组件的样式不会渗透到子组件，不会造成样式污染。这个时候如果你想让样式中的一个选择器作用得更深（渗透到子组件），可以使用深度选择器:deep()。
举个例子
不会影响子组件样式
<template>
<div class="mb-4">
<el-button>按钮</el-button>
</div>
</template>
<style scoped>
.el-button>span {
color: red;
}
</style>
会对子组件生效
<template>
<div class="mb-4">
<el-button>按钮</el-button>
</div>
</template>
<style scoped>
:deep(.el-button>span) {
color: red;
}
</style>
