Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线。

这个底部横线其实是一个 border-bottom,不过对于表头使用了 th 元素,对于表数据使用了 td 元素,因此修改的时候需要兼顾两种元素。

如果你只是修改表数据的样式,而不修改表头,那只需修改 td 元素

修改方式:在 style 标签添加如下样式即可

//去掉表格内的线
table th,
table td {
border-bottom: none !important;
}
//去掉最下面的那一条线
.el-table::before {
height: 0px;
}
.customer-table .el-table__fixed-right::before,
.el-table__fixed::before {
width: 0;
}

(Element UI 组件 Table)去除单元格底部的横线的更多相关文章

  1. html table中单元格自动换行

    table中单元格自动换行样式: table-layout: fixed; word-wrap: break-word;   table-layout 可能的值(IE不支持inherit属性) 值 描 ...

  2. css table 合并单元格

    1. css table 合并单元格 colspan:合并列, rowspan:合并行, 合并行的时候,比如rowspan="2",它的下一行tr会少一列: 合并列的时候,比如co ...

  3. table中tr间距的设定table合并单元格 colspan(跨列)和rowspan(跨行)

    table中的tr的默认display:table-row,虽然可以修改为display:block但是就失去了tr特有的显示效果,如(td自动对齐): 并且在tr中对起设定padding是有用的,可 ...

  4. table合并单元格

    table合并单元格 新建一张表格.要求表格有四行四列,当中第一行的四列合并,第二行.第三行和第四行的第一列合并 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  5. element ui组件的开始时间-结束时间验证

    <el-date-picker v-model="seach.before" type="date" placeholder="开始时间&quo ...

  6. ant design Table合并单元格合并单元格怎么用?

    1.ant design table合并单元格怎么用?

  7. table合并单元格colspan和rowspan .

    colspan和rowspan这两个属性用于创建特殊的表格. colspan是“column span(跨列)”的缩写.colspan属性用在td标签中,用来指定单元格横向跨越的列数: 在浏览器中将显 ...

  8. 合并table相同单元格的插件(基于jquery的)

    正好项目中有个小需求, 要求把表格指定列中内容相同的单元格进行合并,本质上涉及的就是td的rowspan属性, 数出含相同内容单元格的个数, 然后给第一个与上一行内容不同的td其rowspan属性附上 ...

  9. bootstrap table 根据单元格中的数据改变单元格的样式

    在bootstrap-table.js里面列属性 formatter就是用来格式化单元格的,其默认值是undefined 类型是function,function(value,  row, index ...

随机推荐

  1. ROS之初见Hello World

    前言 最近在玩ROS,笔记中断了一段时间. ROS即Robot Operating System,机器人操作系统,是一个开源框架,主力语言是C++和python,提供了硬件抽象.设备驱动.库函数.可视 ...

  2. TypeScript 中 Optional Chaining 和 Nullish Coalescing

    Optional Chaining 解决的问题是重复且无意义的判空,之所以说无意义,是对业务来说它不是必需的,但不判空,程序直接就挂了,比如: let x = foo.bar.baz();   这里的 ...

  3. 真正的原生JS数据双向绑定(实时同步)

    真正的原生JS数据双向绑定(实时同步) 接触过vue之后我感觉数据双向绑定实在是太好用了,然后就想着到底是什么原理,今天在简书上看到了一位老师的文章 js实现数据双向绑定 然后写出了我自己的代码 wi ...

  4. Linux进阶之链路聚合

    CentOS7用命令配置链路聚合 链路聚合是一个计算机网络术语,将多个物理端口汇聚在一起,形成一个逻辑端口,以实现出入流量在各成员端口的负荷分担,交换机根据用户配置的端口负荷分担策略决定网络封包从哪个 ...

  5. Lombok 插件安装和使用

    引言 以前的 Java 项目中,充斥着太多毫无技术含量的代码,比如类属性的 getter/setter/toString 方法,还有就是异常处理.I/O 流的关闭操作等.这些样板代码虽然可以通过 ID ...

  6. java 计算下面级数之和 1/3+3/5+5/7+...+97/99

    代码实例图:package judgment;/** * 计算下面级数之和 * 1/3+3/5+5/7+...+97/99; */public class Judgment { public stat ...

  7. Git常用命令+本地连接远程仓库

    一.git命令整理 git config --global user.email "邮箱名":绑定GitHub邮箱 git config --global user.name &q ...

  8. unity texture 占用内存大小对比

    打包多种类型的项目,空项目和10张放在Resources文件夹中的图为比较案例.以下是比较数据. IPHONE: 1.空项目----空间占用量42.3MB----IPA大小10MB 2.10张1200 ...

  9. 用 Python 写个贪吃蛇,保姆级教程!

    本文基于 Windows 环境开发,适合 Python 新手 本文作者:HelloGitHub-Anthony HelloGitHub 推出的<讲解开源项目>系列,本期介绍 Python ...

  10. Step By Step(Lua迭代器和泛型for)

    Step By Step(Lua迭代器和泛型for) 1. 迭代器与Closure:    在Lua中,迭代器通常为函数,每调用一次函数,即返回集合中的"下一个"元素.每个迭代器都 ...