这是由于浏览器的缩放处理不当造成的。
如果你有一个1 px的边框，并且DPI Scaling设置为150%，那么从技术上讲，边框应该是1.5px。因为浏览器不使用亚像素渲染，所以它在1 px和2 px之间交替。
有多种方法来处理它。

1.将border-width设置为0.01px

一个快速而粗略的解决方法，因为浏览器将回退到至少1px

2.使用resolution介质查询

根据缩放级别将边框宽度更改为适当的小数。

@media (min-resolution: 120dpi) {
  table, th, td {
    border-width: 0.75px;
  }
}

@media (min-resolution: 144dpi) {
  table, th, td {
    border-width: 0.666px;
  }
}

@media (min-resolution: 192dpi) {
  table, th, td {
    border-width: 0.5px;
  }
}

以下是不同DPI缩放级别及其值的概述

DPI缩放级别

• 较小100%（默认）= 96 dpi
• 中等125% = 120 dpi
• 较大150% = 144 dpi
• 超大200% = 192 dpi

3.脚本语言

使用window.devicePixelRatio变量，通过JavaScript将border-width更改为每个缩放级别的相应小数。

使用DvdRom的答案，我修复了这个问题与Javascript和CSS变量，以获得一个1px的边界间距。看起来像它的工作在Firefox，Chrome，边缘，Opera和勇敢。

let cssRoot = document.querySelector(':root');
cssRoot.style.setProperty
(
     '--table-border-spacing',
     `${1 / window.devicePixelRatio}px`
);

:root {
    --table-border-spacing: 1px;
}

table {
    border-collapse: separate;
    border-spacing: var(--table-border-spacing);
}