element ui 怎么调整table的行高

07-17 477阅读

element ui 怎么调整table的行高

element ui 怎么调整table的行高
(图片来源网络,侵删)

在Element UI中,调整Table的行高可以通过CSS覆盖默认的样式来实现。你可以为Table添加一个自定义类名,然后在CSS中指定tr的height属性来调整行高。

以下是一个简单的例子:

  1. 在你的Vue组件中,给添加一个自定义的类名,比如custom-table-class:

    
      
        
      
    
  2. 在你的CSS文件中,指定.custom-table-class tr的height属性来调整行高:

    
    .custom-table-class tr {
      height: 60px; /* 你想要的行高 */
    }
    

    上面不起作用就用这一段:确保这段CSS被加载,行高就会按照你指定的值来显示。如果你使用了scoped样式,你可能需要使用深度选择器 >>> 或 /deep/ 来确保你的样式能够穿透组件边界。

    
    .custom-table-class /deep/ tr {
      height: 60px; /* 你想要的行高 */
    }
    
VPS购买请点击我

文章版权声明:除非注明,否则均为主机测评原创文章,转载或复制请以超链接形式并注明出处。

目录[+]