### 深度作用選擇器deep的應用 什么是深度作用選擇器： > 當前組件A 引入一個其他組件B做應用，A組件由于scoped作用，A組件本身的全部html標簽都會包含一個 data-v-xxx 的屬性名稱，使得css樣式達到私有效果。被使用的組件B由于某些原因，編譯解析后各個html標簽不會形成 data-v-xxx 的屬性，這樣在組件A中給組件B設置樣式會導致無效。 * 深度作用選擇器： https://vue-loader.vuejs.org/zh/guide/scoped-css.html# > 解決： * 通過深度作用選擇器/deep/ 給B組件的某些標簽設置樣式: ```css <style lang="less" scoped> .a /deep/ .b { /* ... */ } </style> ``` a是組件A的選擇器，b是組件B的選擇器，它們會形成如下效果： ```css .a[data-v-f3f3eg9] .b { /* ... */ } ``` 這樣.b的css樣式就生效了。 > 注意： 某些情況下>>>符號有可能無法正確解析，可以替換為別名 /deep/或::v-deep。 深度作用選擇器的左邊必須是當前組件的css選擇器，右邊是子組件標簽選擇器。