修改elementUI中table组件样式和progress样式

修改elementUI中table组件样式和progress样式_第1张图片
UI给的设计图,要求黑色背景的table和矩形进度条,首先考虑的是切换elementUI的主题,但是这个一切换就是全局切换,而需求是只有一个页面需要用到这种黑色主题,所以采用最粗暴的方法,直接修改elementUI中table组件和progress组件的样式


通过查阅elementUI中table组件的方法获得两个属性row-style和header-cell-style


// 修改table tr行的背景色
     tableRowStyle () {
         return { 'background-color': '#141423', 'color': '#fff' }
     },
     // 修改table header的背景色
     tableHeaderColor () {
         return 'background-color: #141423;color: #fff;font-weight: 500;'
     }

效果如下
修改elementUI中table组件样式和progress样式_第2张图片

你可能感兴趣的:(前端)