Antdesign vue ＜a-table＞组件设置透明背景

原创已于 2024-05-16 08:39:19 修改 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

于 2024-05-16 08:37:40 首次发布

前端专栏收录该内容

1 篇文章

订阅专栏

//修改表格背景
:deep(.ant-table){
  background:rgba(0, 0, 0, 0);
}

//修改表头背景
:deep(.ant-table-thead>tr>th) {
  background: rgba(7, 10, 40, 0.3);
  color: #e6e6e6;
  font-size: 16px;
}

//修改body背景
:deep(.ant-table-tbody>tr>td) {
    color: #e6e6e6;
    font-size: 16px;
    transition: background-color 0.2s ease;
    background-color: rgba(0, 0, 0, 0.1) !important;
}

//修改鼠标悬浮颜色
:deep(.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td) {
  background: rgba(49, 210, 235, 0.3) !important;
}


//修改分页器颜色
:deep(.ant-pagination) {
  color: #1677ff !important;
  .ant-pagination-item-active{
    background-color: rgba(0, 0, 0, 0.1);
    color: #1677ff;
  }
}