iview Table 修改样式

思路1:自己写table、thead、tfoot、tbody、tr、td等的样式以及是适配样式。

思路2:自己写样式，覆盖想要修改的样式

自己定义small-table样式，放在table上面，然后依次修改自己想要的进行覆盖

<style lang="less">
  .small-table .ivu-table-cell {
    padding: 0px;
  }
  .small-table td {
    height: 0px;
  }

</style>
<template>
    <Table class="small-table" size="small" border :columns="vipProductColumns"         :data="data3" :disabled-hover="true" ></Table>

</template>
export default {
  name: 'CollectingSilver',
  components: {
    memberS, ProId
  },
  data () {
    return {
      vipProductColumns: [
        {title: '项目编号',key: 'proNumber', align: 'center'},
        {title: '项目名称',key: 'proName', align: 'center'},
        {title: '总次数',key: 'totalDegree', align: 'center'},
        {title: '剩余次数',key: 'Remainder', align: 'center'}
      ],
      data3: [
        {
          proNumber: 31313,
          proName: '洗吹剪',
          totalDegree: 30,
          Remainder: 30
        },
        {
          proNumber: 43121,
          proName: '多了去了',
          totalDegree: 30,
          Remainder: 30
        },
        {
          proNumber: 43121,
          proName: '吃肉',
          totalDegree: 30,
          Remainder: 30
        },
        {
          proNumber: 43121,
          proName: '吃牛肉',
          totalDegree: 30,
          Remainder: 30
        }
      ]
    }
  },

效果图：

padding：18px；覆盖为 padding：0

height：40px；覆盖为 height：0

优点：不需要全部重写适配样式