为什么 Chrome 会在我的 Div 中添加一个像素

Question

我创建了一个 1010px 长的 5px 边框，使其长度为 1020，但是，当我在 chrome 中检查 div 时，尽管代码仍然说它是 1010px 并且它的边框是 5px 它实际上是1021像素

我可以确认左右边框都没有添加像素，因为 div 应该容纳 5 个单独的图像，每个图像都是 202px 宽，所以所有 5 个应该完全适合没有间隙，但第一个图像是最小的间隙在它和左边框之间

我以前完美地完成了这项工作，但使用表格，我目前正在重新设计网站以删除所有表格并用 div 替换它们，同时保持完全相同的外观

这是创建 div 的代码

<div width="1010" align="center" style="border: 5px solid #9DBFFF; margin:0px; padding:0px;">

注意：是的，我首先将样式移到 .css 文件中，这是重新设计的另一部分，删除所有样式并将它们放入 .css 文件中

Answer 1

您可以尝试在样式属性中使用“宽度”属性，如下所示：

<div align="center" style="border: 5px solid #9DBFFF; margin:0px; padding:0px; width:1010px;">

我在 Chrome 中检查了 div，它的宽度与 css 中指定的确切宽度完全相同。