在Vue的項目中占遥，style的樣式都會增加 scoped 標識當前樣式只影響當前頁面組件神僵，通常也會使用像Element UI和 Vant UI組件庫闷旧，這就涉及到了如何修改默認組件樣式的問題了。
1.在不使用css預處理器的情況哮洽，使用 >>> 打却，改變默認組件樣式（以Vant UI為例子）
<style scoped>
.class >>> .van-button {
background: red;
}
</style>
2.在使用less的情況下杉适，使用::v-deep或/deep/谎倔，改變默認樣式柳击。
<style lang="less" scoped>
::v-deep .van-button {
background: red;
}
/deep/ .van-button {
background: red;
}
</style>
3.在使用scss的情況下，要使用::v-deep片习，/deep/反而會報錯（可能是不支持捌肴？）蹬叭。
<style lang="scss" scoped>
::v-deep .van-button {
background: red;
}
/* 會報錯
/deep/ .van-button {
background: red;
}
*/
</style>
附錄：順帶一提，scss和less預處理器是可以使用css變量的状知，scss使用的是$變量名秽五，less使用的是@變量名。
<style lang="less" scoped>
::v-deep .van-button {
background: @theme-color;
}
</style>
<style lang="scss" scoped>
::v-deep .van-button {
background: $theme-color;
}
</style>
