1. 修改具体组件的样式
① vue组件中，在style设置为scoped的时候，里面再写样式对子组件是不生效的，如果想让某些样式对所以子组件都生效，可以使用 /deep/ 深度选择器。
父类有/deep/后子类自动也会深度选择，因此不必重复写
② 但有时候即便加了深度选择器，仍然修改样式失败，这是什么原因呢？一般情况下都是由于优先级不够的原因所引起的，对于此种情况，比较常用的方法为：
i. 在选择器中多写几层，提高选择器的权值，比如原本是.el-date-editor可以写成.el-date-editor.el-input，这样选择器的权值就从10变成了20；
ii. 直接在要修改的样式后加 !important。
③ 一般情况下，找到一个组件的最外层选择器，就可以在这个最外层选择器内一步步按照自己的需求修改下去，比如：
/deep/.el-dialog{
.el-dialog__header{
background-color: #4b76f4;
text-align:center;
}
}但是还有一些情况下，是不适用的，比如TimePicker时间选择器的具体时间选择部分，就是固定定位，直接挂载在body下面的，直接全局修改又怕影响别的页面，怎么办呢？
对于这类情况，我们在使用的时候，要注意仔细阅读文档，一般情况下都会有一个属性是可以直接赋予这类div一个类名的，比如TimePicker组件就是propper-calss可以定义TimePicker 下拉框的类名
2.自定义主题
① 为什么要提到自定义主题呢？
我们最开始在demo版本的开发的时候，基本上就使用原始主题就能满足我们的需求了，但是版本迭代完善的时候，UI设计师通常都会对页面进行整体设计，这些设计过的页面整体主题并不一定与Element UI原有的主题风格是一致的。
在这种情况下，如果我们仍然一个一个去改的话，所花费的时间成本是较大的，还容易有遗漏之处，合理使用自定义主题，则能节省我们更多的时间，效率更高
② 如何使用自定义主题
我比较推荐的有两种方式
一是使用在线主题编辑器
使用Element UI官网的在线主题编辑器，修改定制 Element 所有全局和组件的 Design Tokens，实时预览样式改变后的视觉。
下载根据新的定制样式生成的完整的样式文件包
将这个文件包放入项目文件夹，并引入这个新的样式文件
import Vue from 'vue'
import '../theme/index.css' //新的样式文件
import ElementUI from 'element-ui'
Vue.use(ElementUI)二是直接在项目中改变 SCSS 变量
Element 的 theme-chalk 使用 SCSS 编写，如果你的项目也使用了 SCSS，那么可以直接在项目中改变 Element 的样式变量。
新建一个样式文件，例如 element-variables.scss，写入以下内容：
$--color-primary: #4b76f4 ; /* 改变主题色变量 */
/* 改变 icon 字体路径变量，必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';
@import "~element-ui/packages/theme-chalk/src/index"; 在项目的入口文件中，直接引入以上样式文件即可
（无需引入 Element 编译好的 CSS 文件）
import Vue from 'vue'
import Element from 'element-ui'
import './element-variables.scss'
Vue.use(Element)
