在网页设计中，使用100vw单位与传统100%宽度存在关键区别。100vw计算整个视口宽度，包含滚动条；而百分比宽度则不包括滚动条。此差异可能导致页面布局问题，尤其是在需要宽度占满屏幕的设计中。
今天在写一个企业官网的时候，由于页面的一个地方要保证宽度占满整个屏幕，且随着屏幕分辨率的改变比例也不改变，所以我想到了用vw单位来写。
而页面的其他部分还是传统的宽度100%来写，本来100vw和body的100%应该没什么不同，但是页面却出现了横向滚动条，滚动后发现用了100vw的那个div与其他普通的100%宽度的div格格不入，100vw的比普通的多出了刚好是一个滚动条的宽度，于是我上网搜索了一下，终于看到有一个人回复：
vw计算的是整个视口的宽度，包括滚动条
百分比计算宽度的后会不包括滚动条
果然是这样，以后我争取少用vw，或者尽量不取100vw这个值。
PS：移动端开发就不用顾忌这个问题，因为移动端的滚动条不占位置
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
