更改element-ui 已上传文件列表回显样式

最新推荐文章于 2025-04-10 09:57:53 发布

M-Didid

最新推荐文章于 2025-04-10 09:57:53 发布

阅读量5.8k

点赞数 2

分类专栏： ElementUI Vue.js学习文章标签： elementui

本文链接：https://blog.youkuaiyun.com/qq_41251187/article/details/109241652

版权

el-upload 样式修改 CSS 前端开发 Vue组件

关键词由优快云通过智能技术生成

Vue.js学习同时被 2 个专栏收录

15 篇文章

订阅专栏

ElementUI

5 篇文章

订阅专栏

效果

在这里插入图片描述

对el-upload样式进行修改

.el-breadcrumb__inner,
.el-breadcrumb__inner a {
  font-weight: 400 !important;
}

.el-upload {
  input[type="file"] {
    display: none !important;
  }
}

.filestyle {
  .el-upload {
    position: absolute;
  }

  .el-upload-list {
    display: inline-block;
    position: absolute;
    margin-left: 65px;
    margin-top: -6px;

    li {
      height: 35px !important;
      padding: 5px !important;
      width: 120px;
    }
  }

  img {
    display: none !important;
  }

  .el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name {
    line-height: 20px !important;
  }
}