HTML元素的大小相對於屏幕，而不是父母

Question

目前我想弄清楚是否有一種方法來設置HTML元素的大小相對於屏幕的大小，而不是使用百分比的其父元素的大小。我想這樣做是爲了在我的網站上創建圖像大小的一致性。

我想使用百分比來確保我的圖像適當調整大小以響應瀏覽器調整大小的更改。

例如，如果我將圖像的寬度設置爲「width：60％;」我希望我的圖片佔用60％的屏幕空間，而不是60％的嵌套div。

是否有一種方法可以實現此目的？

Answer 1

是：您可以使用vw和vh單位。這些代表視口（=瀏覽器窗口，但在全屏模式下，在移動設備上，這等於屏幕尺寸）寬度和高度的百分比。