Chrome Inspector显示的页面宽度与显示器不同

Question

为什么Chrome中的Dev Inspector显示宽度为100％的宽度页面的宽度与我在显示器上的宽度不同？我有1920x1080显示器和全屏我不会得到1920但只有1519像素。此数字通过缩放更改。 这背后的原因是什么？当我没有关于宽度的正确信息时，很难对代码进行编码。

Answer 1

当你在CSS中给元素的宽度为100％时，你基本上是说“使这个元素的内容区域完全等于其父元素的显式宽度 - 但前提是它的父元素有明确的宽度。”所以，如果你有一个400px宽的父容器，给定宽度为100％的子元素也将是400px宽，并且仍将受到边距，填充和边框的限制 - 在100％宽度设置之上。

请点击此处了解更多https://www.impressivewebs.com/width-100-percent-css/