关于html页面中头部navbar设置fixed绝对定位后，width 100% 会溢出覆盖滚动条

情况如下图：
头部覆盖住了滚动条

我遇到的情况分析：

前提： 头部和中间主体部分都在一个大的div元素下面，当头部采用fixed布局，中间主体部分没有采用定位且其高度超出父元素的高度时，会溢出导致滚动条的出现。

分析：此时滚动条是相对父元素出现的，不是相对于整个body的，而fixed定位是相对于整个浏览器窗体也就是body定位的，所以fixed定位的头部会压住滚动条。为了解决这个问题，就需要使滚动条是相对于整个浏览器产生的。

解决方法：这里设置中间主体部分为absolute即可，absolute是相对于离它最近的有定位的父元素进行定位（如果没有定位的父元素则相对于浏览器窗口）。这里因为父元素没有定位，所以中间主体部分也是相对整个浏览器定位的，其高度超过浏览器溢出时产生的滚动条也就是相对于整个浏览器的，fixed定位的头部自然就不会覆盖住滚动条了。

fixed和absolute的区别

• 区别：

1. 相对定位的元素不同：absolute是相对于离它最近的有定位的父元素进行定位（如果没有定位的父元素则相对于浏览器窗口）；fixed是相对于浏览器窗口定位
2. 在有滚动条的页面中，absolute会跟随页面滑动，fixed不会滑动，始终固定在同一位置