ElementUI表格el-table改表头样式,el-table改样式

代码先贴出来

:header-cell-style="{ color: '#fff',backgroundColor:'#3E8EF7' }"

这个用法在element里面写的不是很详细,这里看一下我写的案例

写在el-table标签里面
看图实例，改的样式，是表头的，就是姓名、密码那一栏，数据不会变，只有表头那一行会变

<el-table
            :data="UserList"
            border
            :header-cell-style="{ color: '#fff',backgroundColor:'#3E8EF7' }"
          >
            <el-table-column prop="username" label="用户名" width="120">
            el-table-column>
            <el-table-column prop="password" label="密码" width="120">
            el-table-column>
            <el-table-column prop="nickname" label="昵称" width="120">
            el-table-column>
            <el-table-column prop="email" label="邮箱" width="120">
            el-table-column>
            <el-table-column prop="phone" label="手机号" width="120">
            el-table-column>
            <el-table-column prop="createTime" label="注册日期" width="140">
            el-table-column>
            <el-table-column prop="address" label="地址"> el-table-column>
            <el-table-column label="操作" fixed="right">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  @click="handleEdit(scope.$index, scope.row)"
                  >编辑el-button
                >

                <el-popconfirm
                  title="这是一段内容确定删除吗？"
                  @confirm="handleDelete(scope.$index, scope.row)"
                >
                  <el-button size="mini" type="danger" slot="reference"
                    >删除el-button
                  >
                el-popconfirm>
              template>
            el-table-column>
          el-table>

看结果图吧