Vue页面内修改外部引进组件CSS(局部修改)

前言

在实际的Vue项目中，我们经常需要引进一些外部组件，elementUI, ant-designed，之类的，而且我们总需要在某些下，对这些个组件的某些样式进行修改（不影响全局样式的情况下修改）

实现

第一种
在选择器前面加个id选择器来限制

第二种
在选择器前面加个类选择器来限制

第三种
在vue中，我们为了避免父组件的样式影响到子组件的样式，会在style中加 // 当然了把 /deep/ 换成 >>>，也可以达到同样的效果

注意：
1.前两种不能加上scoped不然不会生效
2.el-dialog 中有个append-to-body的属性，在对局部组件的样式进行修改时，一定要注意这个属性的值要为false，不然无法生效
3./deep/ 和 >>> 不能用在 lang = ‘scss’ 的 style 内。