scoped属性与 element-ui 样式

1 、vue 文件中 style 标签内 scoped 后，有时候需要修改 elemet-ui 控件样式，但是发现不成功。

  想找到解决方案，首先来看看不生效的原因

  1)、首先，scoped 是如何实现局部样式的？

   查看 vue-loader 文档，根据文档可以知道，当

   上图中 data-v-5752faac 是当前组件 test 的独特标签（其他是父元素带上的，这里忽略），可以看到子组件 el-button 带上了此标签，而非根元素 span 没带上，因此对 span 的修改是不生效的，此时如果手动在span元素上加上 data-v-5752faac，会发现样式生效。

解决方案：

方案一、 加上一个非 scoped 样式

方案二、采用深度选择器，组件的样式可以渗透到子组件相应的元素上

 1、  >>>

 2、deep（less语法中）、

 3、/deep/（sass语法中）选择器