elment table静态表格 +表头居中加粗和表格内居中

效果图

注意的地方
表头居中加粗 header-cell-class-name='active-header' header-cell-class-name是element表格自带的参数
表格内居中cell-class-name="table-center"cell-class-name是el自带的参数

  
1

居中样式

   /deep/.active-header{
    color: #333;
    text-align: center;
  }
  /deep/.table-center{
    text-align: center;
  }
1
2
3
4
5
6
7

全部代码

 
    

         
            
            
            
            
            
            
            
            
            
                
            
        
    
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

 tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

.content{
  background-color: #fff;
    /deep/.active-header{
    color: #333;
    text-align: center;
  }
  /deep/.table-center{
    text-align: center;
  }
}
1
2
3
4
5
6
7
8
9
10