在vue的開發中，我們需要引用子元件，包括ui元件（element、iview）。但是在父元件中加入scoped之後，在父元件中書寫子元件的樣式是無效果的。去掉scoped之後，樣式可以覆蓋。但這會污染全域樣式，為了解決這個問題，vue-loader新增書寫方式。
父元件：
子元件：
這樣的寫法及修改了子元件的樣式，又不會污染全域樣式！
官網文件：Scoped CSS · vue-loader
Tips:此方式從vue-loader 11.2.0 開始支援
在使用vue 的開發中，我們有時會引用外部元件，包括UI 元件（ElementUI、iview）。
當登入後複製
我们把 需要修改子组件的样式 写在上面那个全局样式里面
如果你希望 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用 >>> /deep/ 操作符：
有些像 SASS 之类的预处理器无法正确解析 >>>。这种情况下你可以用 /deep/ 操作符取而代之 —— 这是一个 >>> 的别名，同样可以正常工作。
OK，主要内容就是以上几点。
需要额外补充的是：
1、通过 v-html 创建的 DOM 内容不受作用域内的样式影响，但是你仍然可以通过深度作用选择器来为他们设置样式
2、CSS 作用域不能代替 class
3、在递归组件中小心使用后代选择器
以上是如何解決vue開發中父元件新增scoped後無法修改子元件樣式問題的詳細內容。更多資訊請關注PHP中文網其他相關文章！
