Vue3框架中让table合计居中对齐

第一步:给它加一个类名 center-table 如下:

html 复制代码
 <el-table
      :data="datas.shows"
      max-height="600px"
      show-summary
      stripe
      border
      style="width: 100%"
      :header-cell-style="{ textAlign: 'center' }"
      :cell-style="{ textAlign: 'center' }"
      class="center-table"
    ></el-table>

第二步: 使用v-deep选择器

css 复制代码
:deep(.center-table td), 
:deep(.center-table th) {
  text-align: center !important;
}

效果

原创作者:吴小糖

创作时间:2023.11.24

相关推荐
进击的松鼠7 分钟前
OpenClaw 的五层架构设计与解析
前端·架构·agent
JavaGuide11 分钟前
Claude Code 新功能Agent View 发布:终于不用在一堆终端窗口里找 Agent 了!
前端·后端·agent
不简说12 分钟前
前端可视化打印设计器sv-print,一口气更新了30版
前端·源码·产品
颖火虫盟主13 分钟前
Claude Code Hook 系统详解与 Hello World 实操
前端·网络·数据库
JavaGuide28 分钟前
Claude Code + BrowserAct,夯爆了!一句话让 AI 帮你操控浏览器。
前端·后端·ai编程
七十二時_阿川29 分钟前
Electron WebContents 完全指南:页面渲染、导航控制与安全实战
前端·electron
用户114818678948430 分钟前
Vue 开发者快速上手 Flutter(五) -状态管理路径
前端
七十二時_阿川36 分钟前
Electron 主进程和渲染进程如何通信?这篇讲清楚了
前端·electron
前端那点事39 分钟前
Vue3+TS 封装高复用 ECharts 通用组件,自适应+防抖+主题切换,开箱即用
前端·vue.js
七十二時_阿川43 分钟前
从零到精通:Electron 窗口管理高级技巧
前端·electron