Javascript 了解css边框框处于活动状态时的offsetWidth和clientWidth

我来自这个问题：

我知道这是标准盒子模型的情况，对吗

但当你有这样的东西时会发生什么：

*{
  box-sizing: border-box;
}

offsetWidth和clientWidth现在相等吗？这个规则总是这样吗

那么填充框呢？

自己试试：

默认情况下，它设置为

框大小：边框框

，但只需在样式中更改它即可获得不同的结果

单击按钮时，它会为您计算

offsetWidth

和

clientWidth

偏移宽度等于除边距以外的所有宽度，因此如果使用

边框框

，则只需获得指定的宽度

客户机宽度等于除边距和边框以外的所有宽度，所以当您使用

边框框时，您只需获得指定的
宽度-边框

offsetWidth

不带边框框

：

offsetWidth

=

width+padding+border

使用

边框框

：

offsetWidth

=

width

clientWidth

不带边框框：

clientWidth

=

width+padding

使用

边框框

：

---

clientWidth

=

width-border

所以你说框大小根本没有影响，当border为0时它们总是相同的，是吗？@Vandervals border为0是不够的，但是如果边框和填充都为0，那么框大小不会改变最终结果。但是如果有任何边界或填充，那么最终结果是不同的。实际上，如果您使用

边框框

，您将得到指定为

宽度

，但如果没有它，您将得到

宽度+填充+边框

@Vandervals我在回答中添加了一个关于

偏移宽度

和

客户端宽度

结果的简要摘要。