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

相关推荐
Komorebi_99998 小时前
LangChain Day5 课程:Agent 智能代理
前端·langchain·大模型
七牛云行业应用8 小时前
别等了!xAI 的终端编码 Agent 来了——Grok Build 0.1 安装到并行 Agent全流程
前端
angerdream8 小时前
Android手把手编写儿童手机远程监控App之WebRtc切换摄像头与桌面共享
vue.js
Asmewill8 小时前
LangGraph学习笔记三(State)
前端
kisshyshy8 小时前
# 🔥 数组去重:从双重循环到 Set,面试官想听什么?
javascript·面试
史前码农JH8 小时前
nodejs项目Monorepo模式的基础操作
前端
RD_daoyi8 小时前
Google 网站收录全流程解析:抓取、索引与排名机制详解
前端·javascript·人工智能·学习·搜索引擎·html
@大迁世界8 小时前
AI还替不了的JS能力
开发语言·前端·javascript·人工智能·ecmascript
相忘于江湖4265438 小时前
vs code 代码保存自动格式化
前端·vue
暗冰ཏོ8 小时前
2026前端开发资源整理大全:从基础学习到工程化实战的完整导航
前端·javascript·css·前端框架·html