a-table 冻结列导致边框

css 复制代码
<style lang="less">
 

.check-task-management-box .table-wrap {
  .ant-table,
  .ant-table-container,
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td,
  .ant-table-cell {
    border-color: #b6c3cf !important;
  }

  .ant-table-thead > tr > th::before {
    background-color: #b6c3cf !important;
  }

  .ant-table-wrapper .ant-table.ant-table-bordered > .ant-table-container > .ant-table-header > table {
    border-color: #b6c3cf !important;
  }

  .ant-table-wrapper .ant-table-thead > tr > th {
    height: 40px;
    padding: 8px;
    color: #1f1f1f;
    font-size: 14px;
    font-weight: 600;
    background-color: rgba(239, 246, 255, 1);
  }

  .ant-table-wrapper .ant-table-tbody > tr > td {
    height: 42px;
    padding: 8px;
    color: #1f1f1f;
    font-size: 13px;
    border-bottom: 1px solid #efefef;
  }

  .ant-table-tbody > tr:hover > td {
    background: #fafcff;
  }

  .ant-pagination {
    margin: 10px 12px;
    font-size: 14px;
  }

  .ant-pagination-item,
  .ant-pagination-prev,
  .ant-pagination-next {
    min-width: 24px;
    height: 24px;
    line-height: 22px;
  }

  /* 表体用 scrollbar-gutter 稳定占位,避免表头/内容宽度不一致 */
  .ant-table-body {
    overflow-y: auto !important;
    overflow-x: auto !important;
    scrollbar-gutter: stable;
    border-right: 1px solid #b6c3cf;
    box-shadow: inset 0 -1px 0 0 #b6c3cf;

    /* 滚动条整体 */
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    /* 滚动条轨道 */
    &::-webkit-scrollbar-track {
      background: #fff;
      border-left: 1px solid #b6c3cf;
    }

    /* 滚动条滑块 */
    &::-webkit-scrollbar-thumb {
      background: #b6c3cf;
      border-radius: 4px;
    }

    &::-webkit-scrollbar-thumb:hover {
      background: #96aab8;
    }

    /* 横纵滚动条交叉角 */
    &::-webkit-scrollbar-corner {
      background: #fff;
      border-top: 1px solid #b6c3cf;
      border-left: 1px solid #b6c3cf;
    }
  }

  /* 表头隐藏自身滚动条,由 scrollbar-gutter 保证宽度一致 */
  .ant-table-header {
    overflow: hidden !important;
    margin-bottom: 0 !important;
  }

  /* 左侧冻结末列(计划名称)添加右侧阴影 */
  .ant-table-cell-fix-left-last {
    box-shadow: 1px 0 0 0 #b6c3cf !important;
  }

  /* 右侧冻结首列:左边框 #EFF6FF + 阴影 #B6C3CF */
  .ant-table-cell-fix-right-first {
    border-inline-start: 1px solid #eff6ff !important;
    box-shadow: -2px 0 0 0 #b6c3cf !important;
  }
   

  /* 修复表头最右列右边框 */
  .ant-table-wrapper .ant-table-container table > thead > tr:first-child > *:last-child {
    // border-inline-end: 1px solid #b6c3cf !important;
     border-inline-end:  none !important;
  }
  
}
</style>
相关推荐
爱勇宝2 小时前
小红花成长新版:模板来了,鼓励也更容易开始
前端·后端·程序员
竹林8182 小时前
Solana前端开发:我在一个NFT铸造页面上被@solana/web3.js的Connection和Transaction签名坑了两天
前端
冬奇Lab2 小时前
每日一个开源项目(第144篇):ai-website-cloner-template - 一条命令、多 Agent 并行,把任意网站逆向成 Next.js 代码
前端·人工智能·开源
玄玄子3 小时前
webpack publicPath作用原理
前端·webpack·程序员
HduSy3 小时前
帮 Claude Code 做了个菜单栏 Token 看板,聊聊里面的一些实现逻辑
前端
用户059540174463 小时前
用了6个月LangChain,才发现AI Agent的记忆存储一直有坑——写了23个Pytest用例才彻底修好
前端·css
奶油mm3 小时前
我偷偷把公司的祖传 jQuery 项目改成了 Vue3,CTO 没发现,但全组都来抄我的代码了
前端
用户2136610035723 小时前
Vue2非父子通信与动态组件
前端·vue.js
PedroQue993 小时前
Vite插件体系1.0.0:API稳定,生产就绪
前端·vite
用户059540174463 小时前
把LLM记忆测试从手工脚本换成Pytest参数化,回归时间从2小时降到10分钟
前端·css