CSS border-width:1px 没有给我同样细的边框

Question

我正在尝试向div. 我的CSS是这样的：

border: solid;
border-width: 1px;

然而，结果边框在我的浏览器中看起来并不那么细。如下图所示，左侧和底部的边框看起来比右侧和顶部的边框更粗。

我想让边框同样细。我尝试添加

shape-rendering: crispEdges;

但它并没有改变外观。JS Fiddle 示例在这里。

我在 Chrome 版本 41.0.2272.101 m 中尝试了这一点 - 它看起来很糟糕。我也在 IE 中尝试过这个 - 看起来不错。所以我知道这不是我的显示器...

Answer 1

您可能在框的左侧和下方有其他元素，并且可能会意外地对它们应用边框，以使它们看起来具有“双”边框。

确保隔离该盒子并重试。

1px 边框不能像您显示的那样不均匀。