Javascript 使用vh/vw vpx和常规PX/%有什么区别？

我已经使用软件很长时间了，但从未问过任何问题。今天我在Firefox的网站上看到它谈论px和%，好像它已经过时了。该网站建议使用视图高度和视图宽度，或视图像素（vh和vi或vpx）。使用

width: 100%;

及

---

。。？？？他们为什么要做出改变呢？

对web元素使用相对大小（如宽度/高度/字体大小等）总是比较好的，所以上个世纪设置显式像素是非常困难的。使用em或更好的REM值设置fontsize，使用百分比设置height/Widt是更好的方法

宽度：100%；-将元素的宽度调整为其容器的100%

宽度：100vw；-将元素的宽度调整为视口宽度的100%

1vw=视口宽度的1%

100vw=视口宽度的100%

同样地—

1vh=视口高度的1% 100vh=视口高度的100%

有趣的是，还有vmin和vmax，它们与视口的大小边有关 1vmin=视口最小边的1% 100vmin=视口最小边的100%

1vmax=视口最大边的1% 100vmax=视口最大边的100%

---

当您旋转屏幕时，vw和vh不会改变，但vmin和vmax会改变，vmin和vmax可用于允许内容改变。

这是否回答了您的问题？浏览器和视口之间存在不同的细微差别<代码>100%表示父元素的100%宽度<代码>100vw表示100%的视口宽度。

width: 100vw;