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

Question

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

我可以确认左边界或右边界都没有添加一个像素，因为div应该容纳5个单独的图像，每个图像的宽度为202px，因此所有5个图像应该完全没有间隙，但第一个图像是最轻微的间隙它与左边界之间的

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

这是创建div的代码

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

注意：是的，我会先将样式移动到.css文件中，然后再将其设置为重新设计的另一部分，删除所有样式并将它们放入.css文件中

Answer 1

您可以尝试在style属性中使用“width”属性，如下所示：

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

我在Chrome中检查了div，它是css中指定的确切宽度。