elementUI 总结

:header-cell-style="{ color: '#fff',backgroundColor:'#3E8EF7' }" 修改头部样式

<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>

效果图