更改element-plus的table样式

表头样式:

复制代码
  <el-table :data="props.tableData" style="width: 100%" :header-cell-style="headerCellStyle" :cell-style="cellStyle">
</el-table>

样式:
// 表头样式
const headerCellStyle = {
  background: '#062549',
  color: '#FFFFFF',
  borderBottom: 'none'
}
// 表格样式
function cellStyle({ rowIndex }) {
  if (rowIndex % 2 == 0) {
    return { background: '#061938', color: '#FFFFFF', borderBottom: 'none' }
  } else {
    return { background: '#062345', color: '#FFFFFF', borderBottom: 'none' }
  }
}

去掉底部白线:(不生效的话在el-table外边加个div)

复制代码
<style scoped lang="scss">
// 去掉底部白线
:deep(.el-table) {
  --el-table-border-color: tarnsparent !important;
  background-color: #071b39 !important;
}
</style>
相关推荐
gis开发之家15 分钟前
《Vue3 从入门到大神33篇》Vue3 源码详解(三):响应式核心思想——从 Object.defineProperty 到 Proxy
前端·javascript·vue.js·vue3·vue3源码
云空34 分钟前
《Three.js 可操控3D魔方(键盘转动+打乱+复原)》
javascript·学习·游戏·3d·three.js
qq_529599381 小时前
react js循环滚动
前端·javascript·react.js
濮水大叔1 小时前
在 DTO 中使用 Form Layout 配置复杂表单,支持 Tabs/Groups/Sections
vue.js·typescript·node.js
张人玉2 小时前
Vue 3 + ECharts 智慧城市大屏——赣州智慧城市数据可视化平台
vue.js·echarts·智慧城市
come112342 小时前
Vue 3 与现代 JavaScript 常用语法指南
前端·javascript·vue.js
dsyyyyy11012 小时前
用JavaScript实现排序算法
开发语言·javascript·排序算法
槑有老呆2 小时前
从零搭建 LLM 流式对话前端:一文读懂 SSE、二进制流与 Vue 3 响应式
前端·javascript
敖行客Allthinker2 小时前
Vuex 状态响应机制:watch 与 subscribe 的对比分析
vue.js
张龙6872 小时前
前端错误监控生产级方案:从 onerror 捕获到 Source Map 精准还原
前端·javascript