• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录

zeyuan-li

  • 博客园
  • 联系
  • 订阅
  • 管理

公告

View Post

el-table(V 2.15.14)在使用树结构表格并且设置align = 'center'后 树结构层级不明显问题解决

开发中遇到的小问题:

如图所示三个层级区分并不明显,用户体验差
解决方案:
自定义CSS:首先取消此列的 align="center"
然后插入以下代码(此CSS为更改图示第二列的样式 如果是其它列请自己获取样式名称)

 // 标题居中
  ::v-deep th.el-table_1_column_2.is-leaf.el-table__cell {
    text-align: center;
  }

  // 数据给一个合适的left
  ::v-deep td.el-table_1_column_2.el-table__cell .cell {
    padding-left: 33%;
  }

更改后效果:

posted on 2024-04-10 11:20  lizeyuan_xiaoli  阅读(52)  评论(0)    收藏  举报

刷新页面返回顶部
 
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3