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

相关推荐
吠品1 分钟前
处理 Python 类继承中那些变来变去的初始化参数
linux·前端·python
云水一下4 分钟前
TypeScript 从零基础到精通(七):从配置到全栈项目落地
前端·javascript·typescript
向日的葵00611 分钟前
Vue 路由传参的三种方式(三)
vue.js·路由
秋天的一阵风22 分钟前
✨ 代码秒跳转、自动补全?全靠 LSP 和 AST!
前端·后端·ai编程
如果超人不会飞32 分钟前
TinyVue Checkbox复选框组件使用指南
前端·vue.js
程序员小淞34 分钟前
写一个行政区划下拉选组件(异步+搜索)
前端
星栈36 分钟前
用 Rust + Makepad 做一个 JSON 查看器:从零到能用的全过程
前端·rust
yijianace37 分钟前
Python爬虫实战:分页爬取 + 详情页采集 + CSV存储
前端·爬虫·python
十九画生38 分钟前
从同步到异步:重新理解 JavaScript 的执行机制
javascript
想吃火锅100540 分钟前
【前端手撕】防抖节流
前端