修改element,vant,mint等ui框架的样式

vant和mint移动端常见,引入单独的css文件,在main.js中引入下即可,直接在对应的vue文件的css通过控制台查看中修改也行,再不济加!important

element:

1.vue框架的css预处理器可解析的情况下:

给组件父元素添加class名,使三箭头穿透函数>>>修改组件内部需要修改的部分

// 折叠面板头部样式
 .collapseBG >>>.el-collapse-item__header{
     background:red!important
 }

2.css预处理器不可解析(如:scss):v-deep深度修改

s.project{
    padding:10px 15px;
    ::v-deep{
      .el-collapse-item__header{
        background-color:red!important;
      }
    }
 }
原文地址:https://www.cnblogs.com/wd163/p/13718597.html