Set the line color of the element ui table table and set the rounded corners/solve the problem that the lines are not displayed or displayed blurred after the element ui table is set with rounded corners, the pro-test is effective

Problem Description

After the table is set to rounded corners and the table border color is set, the border after the modified color cannot be displayed after the rounded corners are set.

problem solved

/* 设置圆角以及边框颜色 */
        .el-table{
    
    
            border-radius: 0 0 10px 10px;
            border-top:1px solid #DEDEDE;
            border-left:1px solid #DEDEDE;
            border-bottom:1px solid #DEDEDE;
        }

        .el-table th.is-leaf {
    
    
            border-bottom: 1px solid #DEDEDE!important;
        }

        .el-table td, .el-table th.is-leaf {
    
    
            border-bottom: 0;
        }

        .el-table__body-wrapper{
    
    
            border-right: 0;
            border-bottom: 0;
        }


        .el-table td, .el-table th.is-leaf,.el-table--border, .el-table--group{
    
    
            border-color: #DEDEDE; 
        }
        .el-table--border::after, .el-table--group::after, .el-table::before{
    
    
            background-color: transparent;
        }

Guess you like

Origin blog.csdn.net/mrliucx/article/details/124065000