欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

解决ElementUI中默认样式的修改

程序员文章站 2022-04-22 19:40:10
...
一、问题描述:

在ElementUI中,有的组件样式并不是我们所需要的,需要进行修改,对默认样式进行修改为目标样式,但是直接写样式是不成功的,修改不了的

二、解决办法:
  1. 通过创建一个css文件,然后在某一个组件中引用,css文件中使用和组件样式一样的命名,这样组件的默认样式就会被覆盖
  2. 在需要更改的组件里新增一个style标签,不要加scoped,然后直接获取class设置样式
  3. 使用 /deep/,前面为修改组件类名的父级组件样式类名,后面为修改组件的类名,里面是样式的修改
    示例代码
.dialogPage   /deep/  .el-dialog  {
margin-left: 20px  !important;
}
``