关于修改ant-design-vue的table组件背景色遇到闪动的问题

项目中需要修改表格的背景色为以下样式
在这里插入图片描述
修改完之后发现表格行还有个hover的背景色,于是再次重置样式如下

 .ant-table-tbody > tr {
    &:hover {
      td {
        // background: red !important;
        background: transparent !important;
      }
    }
  }

这样重置之后,hover的样式确实没了,但是会出现以下闪动的情况,闪动出来一个背景色,找不到到底是哪个元素上的背景色

ant-design-vue表格行背景色闪动的问题

多方查找后才发现,只重置了hover时的td的背景色还不行,需要单独在重置一下td的背景色,如下

.ant-table-tbody > tr {
   &:hover {
     td {
       background: transparent !important;
     }
   }

   td {
     background: transparent !important;
   }
 }

此时就不会有闪动的问题了

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-05-10 11:08:03       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-05-10 11:08:03       100 阅读
  3. 在Django里面运行非项目文件

    2024-05-10 11:08:03       82 阅读
  4. Python语言-面向对象

    2024-05-10 11:08:03       91 阅读

热门阅读

  1. [力扣题解]93. 复原 IP 地址

    2024-05-10 11:08:03       34 阅读
  2. Arrays类

    Arrays类

    2024-05-10 11:08:03      34 阅读
  3. Go语言系统学习笔记(二):进阶篇

    2024-05-10 11:08:03       26 阅读
  4. c#运算符重载

    2024-05-10 11:08:03       29 阅读