求解答 为什么同样是0.5px，width画出来的和border画出来的不一样

上面为width 下面为border

在不同的放大倍数下border会变化

在500%下基本相同

为什么border会随着浏览器放大和缩小改变值 但是width不会

代码如下

.box {
  width: 100px;
  height: 0.5px;
  background-color: red;
}

.box1 {
  border-top: 0.5px solid red;
}


import React from "react";
import "./App.css";
const App = () => {
  return (
    <>
      <div className="box"></div>
      <div>11</div>
      <div className="box1"></div>
    </>
  );
};
export default App;