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

相关推荐
程序猿乐锅14 分钟前
面向对象练习:图书借阅系统里的封装、抽象类与多态
开发语言·前端·数据库·后端·python·学习·1024程序员节
老木避暑研究所18 分钟前
负氧离子数据的采集、清洗与可视化:一套可复用的环境监测数据分析模板
前端·人工智能·数据分析
计算机魔术师37 分钟前
AI 推翻了一个当了30年地基的假设,查的人恰好是立论者
前端
范同学~41 分钟前
项目添加水印
java·前端·javascript
鬼手点金43 分钟前
缓存作为架构约束
开发语言·前端·人工智能·python·microsoft·缓存·架构
月夏44 分钟前
前端第一次接自己的后端:mock 切真接口踩了 2 个坑,组件只改了一行 import
前端·后端·node.js
IT_陈寒1 小时前
React实战技巧总结:如何优雅处理复杂列表的渲染卡顿问题?
前端·人工智能·后端
ZoeLandia1 小时前
React11:数据请求与 TanStack Query
前端·react.js·typescript·react
软件技术NINI1 小时前
基于PHP和MySQL的快递代收点管理系统的设计与实现
开发语言·javascript·数据库·mysql·毕业设计·php·毕设
前端架构师-老李1 小时前
HTML与CSS基础第二课—初识HTML
前端·css·html