VH、VW、VMIN、VMAX

px、%

px : 網頁上就會呈現出100px*100px的正方形，當我們縮放螢幕的時候，這個正方形的大小並不會隨之改變。 & : 使用%的時候，是以父元素為基準，會因為包在外層的div而決定它的寬高

vw、vh、vmin、vmax

vh是view height，指螢幕可視範圍高度的百分比；vw則是view width，指螢幕可是範圍寬度的百分比。
vmin，意思是選取「長或寬較小的百分比」，反之vmax意思就是選取「長或寬較大的百分比」。

比方说我们有一个1000px（宽）和800px（高）的视窗
vw : 代表视窗(Viewport)的宽度为1%，在我们的例子里50vw = 500px。
vh : 窗口高度的百分比 50vh = 400px。
vmin : vmin的值是当前vw和vh中较小的值。在我们的例子里因为是横向模式，所以50vim = 400px。
vmax : 大尺寸的百分比。50vmax = 500px。