用 vue 開發時會用到一些組件庫，例如比較流行的 elementUI ，iView ， museUI …
但是在使用中 有時需要修改組件庫自帶的樣式，這時可能會寫在一個公共的css文件，然后在main.css中引入，這確實是可行的 ，但如果樣式很多，那每個頁面都會加載很多不必要的樣式。 況且，一個頁面的css 寫在 不同的 css文件里面 很不利於維護。這里推薦一個css的屬性 深度選擇器 .
這里提供幾種可用方案
1.一個公共的css文件，然后在main.css中引入。但是樣式很多，每個頁面都會加載很多不必要的樣式，且不利於維護
2.增加important。直接在css文件中，使用原組件類名，增加樣式需要增加【!important】,並且去掉scoped，但是這樣做，就會污染全局組件樣式
3.增加獨有類名，比如elementUI, <el-col class='special-style'>...</el-col>.
4.使用css屬性：deep
比如：在一個商城的項目使用了mint-ui的radio組件，此時mint-ui已經有默認的樣式了，我可以通過提取公共文件的方式來修改，以達到自己想要的，但是同時其他地方也會受到影響
同時只想要修改這個地方的樣式，在其他頁面用到mint-ui的時候不變那么就可以考慮使用 /deep/
.mint-radiolist /deep/ .mint-cell-title {
margin-top: 0.3rem;
}
考慮到deep屬性的兼容問題
.mint-radiolist >>> .mint-cell-title {
margin-top: 0.3rem;
}