有的時候element提供的默認的樣式不能滿足項目的需要，就需要我們隊標簽的樣式進行修改，但是發現修改的樣式不起作用
第一種方法
原因：scoped
解決方法：去掉scoped
注意：此時該樣式會污染全局樣式，可以把它放在公共的css里面
為了不讓所有的 el-input標簽都是該樣式，可以在HTML給改input加上一個類名，比如 modInput
第二種方法
這不去掉scoped 的情況下
在全局樣式中覆蓋，這種解法，有弊端，可能會污染全局樣式。為了不污染全局樣式，也可單獨加個類名
比如在引用全局樣式前引用element ui的樣式
第三種
樣式放到app.vue里面 或者入口文件 index.vue ，樣式就生效了 為了不污染其他頁面樣式，可單獨加個類名
第四種
使用深度作用選擇器，可以通過vue-loader提供的新寫法 vue-loader 寫法如下（先安裝，在使用）：
<style scoped
>
.a >>> .b { /* ... */ }
</style>
某些預處理器（如Sass）可能無法>>>正確解析。在這些情況下，您可以使用/deep/組合器 - 它是別名，>>>並且完全相同。
<style scoped lang="scss">
.form {
background-color: #fff;
/deep/ .list{
font-size: 18px;
}
}
</style>
sass注意要用 /deep/ ,而無法使用 >>> 這個符號。
通過 v-html 創建的 DOM 內容不受作用域內的樣式影響，但是你仍然可以通過深度作用選擇器來為他們設置樣式 。
第五種
<style scoped> with <style>
也許你遇到過這種情況，需要修改某一個ui框架的默認樣式，但是在scoped的style塊中修改不成功。不得不將style塊的scoped屬性拿掉，或者將這個要改變的樣式放進全局樣式里再在main.js中導入，或者直接將樣式定義在App.vue里面。這些都是可行的，但是要注意命名空間要是正確的，不然是找不到樣式的。
這里提供另一種方法。其實在vue的SFC中，是允許多個style塊的。你可以像下面這樣使用：
<style scoped lang="scss">
.order-detail {
// put your local style here
}
</style>
<style>
.mint-button{
// put your global style here if you want to change the lib's style
}
</style>
更多技巧請查看vue專欄 https://blog.csdn.net/qq_42221334/column/info/27230/1