/deep/在vue中的使用，修改第三方组件样式

• 如何避免修改全局样式，破坏整体样式的使用
  在开发中遇到一个问题，vue项目结合element ui使用，但是element ui的样式不一定符合我们的需求，这时我们就需要改变它的样式。如果直接修改element-ui的公共样式文件的话，就会造成全局样式的改变。如何能够在某个特定的组件中修改第三方组件的样式呢，使得我们修改的第三方组件样式只在这个组件中起作用，如如修改element-ui中menu的背景颜色。

我们可以用一个选择器来深度地帮助我们找到这个元素，比如 /deep/

<style scoped>
  .barbox /deep/ .el-menu {
    background-color: #6a4318;
    color: white;
    left: 23%;
  }
</style>

这样就可以通过找到父元素深度的找到我们需要改变的子元素，然后改变它的样式，在使用scoped属性的同时，既修改了特定组件的样式又保证了全局样式不被修改