如何使用屏幕分辨率设置 div 高度/宽度？ [复制]答案

【问题标题】：How do I set div height/width using screen resolution? [duplicate]如何使用屏幕分辨率设置 div 高度/宽度？ [复制]
【发布时间】：2016-12-20 03:45:33
【问题描述】：

我的屏幕分辨率为 2560 x 1440。如果我希望 div 的高度为（例如）我的垂直屏幕分辨率 (144px) 的 10%，我该怎么做？

我猜这必须用 javascript 完成...？

编辑：

vw 和 vh 不是我需要的。

我需要计算机的整个屏幕分辨率，而不仅仅是 vw 和 vh 所做的浏览器窗口。

这篇文章类似的问题确实向用户展示了如何检测屏幕分辨率，但没有具体说明如何使用该屏幕分辨率来修改 CSS 中的 div。

我自己想出来的...

<script>
    document.getElementById("div").style.height = screen.height + "px";
</script>

【问题讨论】：

【解决方案1】：

例如，您可以通过 vh & vw CSS 单位设置宽度和高度来做到这一点 100vh = 视口高度的 100% 100vw = 视口宽度的 100%

或以媒体查询为例

@media screen and (min-width: 1024px) , screen and (min-height: 768px) {
    /* css for 1024px x 768px resolution and up */
}

【讨论】：