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

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

时间:2024-04-10 11:22:32浏览次数:30  
标签:el center 树结构 align cell table 14

开发中遇到的小问题:

如图所示三个层级区分并不明显,用户体验差
解决方案:
自定义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%;
  }

更改后效果:

标签:el,center,树结构,align,cell,table,14
From: https://www.cnblogs.com/zeyuan-li/p/18125664

相关文章

  • [Vue warn]: Do not use built-in or reserved HTML elements as component id: line
    [Vuewarn]:Donotusebuilt-inorreservedHTMLelementsascomponentid:line这个报错是Vue警告不要使用内置的或者保留的HTML元素作为组件的id。在Vue中,组件的id应该是唯一的,并且不应该与HTML元素的标签名相同。比如说,如果有一个组件定义如下:<template><......
  • Seurat Dimplot, Vlnplot画图时报错,Error in setup_panel_guides(..., self = self) :
    SeuratDimplot,Vlnplot画图时报错,Errorinsetup_panel_guides(...,self=self):unusedargument(list(~features.plot,~id))pdf(paste0("EBV_GaC","_Marker_genes_Vln.png"),width=30,height=10)>DotPlot(object=subset_cells,featur......
  • Shell的-n -z -s
    在Shell脚本中,-n和-z是用于条件测试的选项,它们通常出现在test命令或[...]结构中,用来判断字符串是否为空。-zSTRING:当字符串STRING的长度为零(即字符串为空)时,表达式返回true(真)。在条件语句中,你可以这样使用它来检查一个变量是否为空:if[-z"$variable"];then......
  • P1464 Function
    题目链接:本题为一道极其经典的记忆化搜索模板题,务必搞懂并掌握记忆化搜索的常见书写格式。主要思想就是用一个\(dp\)数组将每一个\(w\)函数的值存储起来,下一次检查\(dp[a][b][c]\)的值,如果已经算过就直接调用,可节省大量时间。#include<cstdio>usingLL=longlong;......
  • Shell - [11] 开源Apache Zookeeper集群启停脚本
     一、集群角色部署当前有Zookeeper集群如下主机名ctos79-01ctos79-02ctos79-03Zookeeper○○○ 二、脚本使用 三、脚本内容#!/bin/bash#定义ZooKeeper服务器列表SERVERS=("ctos79-01""ctos79-02""ctos79-03")#定义ZooKeeper安装路径INSTALL_......
  • Python基于Excel数据加以反距离加权空间插值并掩膜图层
      本文介绍基于Python中ArcPy模块,实现Excel数据读取并生成矢量图层,同时进行IDW插值与批量掩膜的方法。1任务需求  首先,我们来明确一下本文所需实现的需求。  现有一个记录有北京市部分PM2.5浓度监测站点在2019年05月18日00时至23时(其中不含19时)等23个逐小时PM2.5浓度数......
  • intellij idea的快速配置详细使用
    IntelliJIDEA是一款功能强大的集成开发环境(IDE),可以用于开发各种类型的应用程序,如Java、Kotlin、JavaScript、Python等。它提供了许多快速配置选项,可以帮助开发人员更高效地开发代码。在这份文档中,我们将详细介绍IntelliJIDEA的快速配置使用方法,让您快速上手使用它。下载......
  • 肖sir__接口测试之unittest框架(14.1)
    接口测试之unittest框架importunittestimportrequestsfromtimeimport*fromjk.HTMLTestRunner3_NewimportHTMLTestRunnerclassCms(unittest.TestCase):@classmethoddefsetUpClass(cls)->None:#类的开始cls.s=requests.Session()@classmethod......
  • Delphi 编译的app无法在android 14安装
    今天用delphi12.1升级旧项目,编译正常,但安装时出下面的提示:08:48:26E/SplitApkInstaller:Failedtofinalizesession:INSTALL_PARSE_FAILED_MANIFEST_MALFORMED:FailedparseduringinstallPackageLI:/data/app/vmdl1849586780.tmp/base.apk(atBinaryXMLfileline#......
  • python web 开发 - 基于flask框架的 Hello World 示例
    pythonweb开发-基于flask框架的HelloWorld示例文章目录pythonweb开发-基于flask框架的HelloWorld示例1、主要步骤2、flask安装3、创建程序4、运行程序5、通过浏览器访问1、主要步骤(1)安裝flask:pip3installflask(2)編寫並......