提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  Javascript

当前栏目

覆盖element-ui原生样式

elementui 代码
2023-04-18 15:36:36 时间
使用深度选择器 /deep/进行作用域穿透，不需要去掉style 标签 scoped 属性。只需要在父类class下的element-ui组件class前加上/deep/，就可以修改默认样式
如下所示 改变原生el-button样式效果图如下：
 
下面是css代码
.bottom-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 13px;
    /deep/ .el-button {
      width:50px;
      height:24px!important;
      background:#447aff;
      border-radius:6px;
      color:#ffffff;
      font-size:14px!important;
      font-family:Microsoft YaHei!important;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    .span{
      display: inline-block;
      position: relative;
      top: 0px;
      left: -7px;
    }
}

相关文章