在日常代码编写中， 想要改变某个页面第三方插件的样式，但其他页面不修改， 在vue 项目中使用 scoped 后 在父组件中的样式无法修改子组件的样式这时可以使用深度作用选择器 /deep/

##如果有以下模板

<div class="PageteamList">    
	<el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
</div>

css 中使用 /deep/ 和 “<<<"

/deep/原理？

在编译组件的时候，如果当前组件内style标签上有scoped属性时，就会给当前组件所有标签上添加一个【data-v-hash】属性，且在标签的css选择器的结尾加上和属性同样的字段，起到唯一性的作用，实现类似于"作用域"的作用，那么就使得当前组件内的样式只会作用于当前组件内的元素

css中样式写法为

<style scoped>
.PageteamList >>> .el-table__row {
  line-height:50px;
  background:red;
}

</style>

即可改变el-table中的样式 ，其他第三方组件亦可