Material-ui: [分隔线]缩放屏幕上的高度不一致

@urirahimi您正在强迫Chrome执行亚像素计算，这通常具有奇怪的行为。
您可以使用以下方法缓解问题：

const theme = createMuiTheme({
  overrides: {
    MuiDivider: {
      root: {
        marginTop: 1,
      },
    },
  ),
});

我尝试将实现方式从背景色更改为边框顶部，但这无济于事。
https://stackoverflow.com/questions/12547580/borders-disappear-in-chrome-when-i-zoom-in

尝试将浏览器的缩放比例提高到90％或100％。 魔法

警告：我仍然使用3.9.2版，并且仅在Firefox和Chrome上进行了测试。

使用thin作为边框粗细为我解决了这个问题。 它让浏览器确定厚度。 在Chrome上， thin被选择为1px / zoom 。 -表示无论缩放级别如何，它将始终精确地保持1个真实像素。 Firefox缩小时的效果相同，但是当缩放比例大于或等于200％时，边框将变为2个真实像素；当缩放比例大于或等于300％时，边框将使3个真实像素，等等。 thin比1px更好。

const theme = createMuiTheme({
  overrides: {
    MuiDivider: {
      root: {
        // Dividers not consistent when zooming.
        // https://github.com/mui-org/material-ui/issues/14815
        borderTop: 'thin solid rgba(0, 0, 0, 0.12)', //this color should be theme.palette.divider if that is set
        backgroundColor: undefined,
        height: undefined,
      },
    },
  ),
});