vue開発では、親コンポーネントがscopedを追加した後.親コンポーネントでサブコンポーネントスタイルを変更できないという問題を解決します.

vueの開発では、uiコンポーネント(element、iview)を含むサブコンポーネントを参照する必要があります.ただし、親コンポーネントにscopedを追加した後、親コンポーネントにサブコンポーネントのスタイルを書くのは効果的ではありません.scopedを削除すると、スタイルを上書きできます.しかし、これはグローバルスタイルを汚染し、この問題を解決するためにvue-loaderが書き方を追加した.
#demo
親コンポーネント:

<style lang="css" scoped>

  header /deep/ .header{
      box-shadow:0px 1px 0px 0px $white;
  }

 
  
header >>> .header{
      box-shadow:0px 1px 0px 0px $white;
}
  
 
  
子组件：
 
  
<template>
   <header>
       <div class="header">
       div>
   header>
template>
  
このような書き方やサブアセンブリのスタイルを修正しても、グローバルスタイルを汚染することはありません.
公式サイトドキュメント:Scoped CSS・vue-loader
Tips:この方法はvue-loader 11.2.0からサポートされています
scoped を取り除くと
ローカルスタイルとグローバルスタイルの混在3深さ使用セレクタvueを用いた開発では,UIコンポーネント(ElementUI,iview)を含む外部コンポーネントを参照することがある.  
  
  
SASSのようなプリプロセッサでは、>>>を正しく解析できないものもあります.この場合、/deep/オペレータで置き換えることができます.これは>>>の別名で、同じように正常に動作します.
OK、主な内容は以上の点です.
追加の補足が必要です:1、v-htmlで作成されたDOMコンテンツは、役割ドメイン内のスタイルの影響を受けませんが、深さの役割セレクタでスタイル2を設定することができます.CSS役割ドメインはclass 3の代わりに使用できません.再帰コンポーネントで子孫セレクタを使用することに注意してください.