开发指南120-表格(el-table)斑马纹

el-table实现斑马纹简单否,看起来很简单,网上给的例子都是加stripe,例如

<el-table :data="tableData" stripe>连官网上的例子都是这样。然并卵。也许是版本问题。这么写,怎么折腾都没有效果。

必须这样写才行

<el-table :data="tableData" :stripe="true">

自定义样式如下:

.el-table__body tr:nth-child(even) > td{

background-color: #f2f2f2 !important;

}

也是折腾了很多写法,网上给的大部分不起作用,也不知道写的人自己试过没有。很多文章都是"扛锄"来的。

鼠标滑过着重显示:

.el-table tbody tr:hover > td {

background:#D9E1E6 !important;

}

也是折腾了很多写法。

我不知道写的是否是官方写法,是否放之四海而皆准。反正在我的环境里确实有效。

相关推荐
小奋斗31 分钟前
深入浅出:JavaScript中防抖与节流详解
javascript·面试
Wcy307651906631 分钟前
web前端第二次作业
前端·javascript·css
艾小码1 小时前
JavaScript 排序完全指南:从基础到高阶实战
前端·javascript·排序算法
柯南95271 小时前
Vue 3 响应式系统源码解析
vue.js
Zestia1 小时前
页面点击跳转源代码?——element-jumper插件实现
前端·javascript
PineappleCoder1 小时前
大小写 + 标点全搞定!JS 如何精准统计单词频率?
前端·javascript·算法
KasukabeTsumugi1 小时前
TypeScript:联合类型可以转化为元组类型吗?数组如何用联合类型逐项约束?
javascript
文艺理科生1 小时前
Nuxt.js入门指南-Vue生态下的高效渲染技术
前端·vue.js·nuxt.js
夏小花花2 小时前
vue3 ref和reactive的区别和使用场景
前端·javascript·vue.js·typescript
掘金安东尼2 小时前
前端周刊第427期(2025年8月4日–8月10日)
前端·javascript·面试