The difference between vh/vw and % in css

1. The difference between vh and vw

Both vh and vw adapt to the display according to the window size ratio,

1vw = 窗口宽度的1%
1vh = 窗口高度的1%

The difference between vh and vw is only in width or height

2. The difference between vh and vw and %

%为相对于父元素尺寸的比例

The difference between vh / vw and % is that one is calculated for the window and the other is calculated for the parent element

3. Scenarios using vh

When using flex layout, flex:1when the remaining space is automatically occupied, when the sub content overflows, it will cause the % calculation height to fail and crash. At this time, you need to use vh to control it