开发指南029-el-table-column对齐属性

简介: 按开发文档和正常理解,el-table-column具有属性align,可以填left,center,right控制内容的对齐方式

按开发文档和正常理解,el-table-column具有属性align,可以填left,center,right控制内容的对齐方式。你真正做的时候,就会发现根本不起作用。

      查网络,大部分怀疑你用错属性了,elment-ui版本不对,css冲突等等。

      还有这样的解决方案:el-table增加 :cell-style=“{ textAlign:‘left’}” 问题是需要控制在列上,有限列要居中,例如名字。有的要右对齐,例如数字字段。

     还有这样的,对对应的列增加:el-table_1_column_4  .cell {

                   text-align: left !important;

      }

     其实都没有回答在点子上。网上大部分解决方案其实都是有问题的。

    正确的原因是el-table-column在使用<template>后会套了层<div>导致设置不生效。知道了原因,解决起来很容易:

    增加:

/deep/ .is-left > div {

   text-align: left;

}

/deep/ .is-right > div {

   text-align: right;

}

即可

相关文章
Element的el-table行列错位对不齐问题处理
本文目录 1. 问题表现 2. 问题发现 3. 问题处理 4. 另一种处理方案
6092 0
Element的el-table行列错位对不齐问题处理
|
编解码
element-ui 表格滚动条(不同分辨率)自适应问题;
element-ui 表格滚动条(不同分辨率)自适应问题;
811 1
|
前端开发
饿了么el-dialog自定义内容以及el-dialog自定义样式
饿了么el-dialog自定义内容以及el-dialog自定义样式
1343 0
|
12月前
|
XML JSON API
如何从 Swagger 导出 API 文档
Swagger 使这项任务相对简单,允许开发者以各种格式(如 JSON 和 YAML)导出 API 文档。在这篇博文中,我们将详细探讨如何从 Swagger 导出 API 文档。
如何从 Swagger 导出 API 文档
|
资源调度 JavaScript 前端开发
前端开发必备!Node.js 18.x LTS保姆级安装教程(附国内镜像源配置)
本文详细介绍了Node.js的安装与配置流程,涵盖环境准备、版本选择(推荐LTS版v18.x)、安装步骤(路径设置、组件选择)、环境验证(命令测试、镜像加速)及常见问题解决方法。同时推荐开发工具链,如VS Code、Yarn等,并提供常用全局包安装指南,帮助开发者快速搭建高效稳定的JavaScript开发环境。内容基于官方正版软件,确保合规性与安全性。
13056 23
|
JavaScript 前端开发
怎样在vue中隐藏el-form-item中的值、设置输入框的值是只读
这篇文章介绍了在Vue框架中使用Element UI组件库时,如何通过v-if指令和v-model绑定来控制`el-form-item`的显示与隐藏,以及如何通过设置`readonly`属性让输入框变为只读状态。
怎样在vue中隐藏el-form-item中的值、设置输入框的值是只读
|
存储
el-tree 动态指定默认选中节点
el-tree 动态指定默认选中节点
1415 6
uniapp实战 —— 弹出层 uni-popup (含vue3子组件调父组件的方法)
uniapp实战 —— 弹出层 uni-popup (含vue3子组件调父组件的方法)
1916 1
|
XML 文字识别 Java
SpringBoot + Tess4J 实现本地与远程图片处理
【4月更文挑战第30天】Spring Boot 是一个流行的 Java 框架,可以方便地搭建各种类型的应用。Tess4J 是一个基于 Tesseract OCR 的 Java 接口库,用于识别图像中的文本。本文将介绍如何结合这两个工具,创建一个应用程序,能够处理本地和远程图像,提取其中的文本。
567 1
|
开发框架 JavaScript 前端开发
在Vue前端界面中,几种数据表格的展示处理,以及表格编辑录入处理操作。
在Vue前端界面中,几种数据表格的展示处理,以及表格编辑录入处理操作。